| |
| Kombination der Methoden und Vererbung |
Innerhalb eines HTML Dokumentes schließt das <html> Element alle anderen Elemente ein - das <body> Element schließt wiederum auch andere Elemente ein und jedes dieser übergeordneten Elemente gibt die Style Sheet Eigenschaften an die darunter liegenden weiter. In einem solchen Fall spricht man von Vererbung (vererbten Eigenschaften). Binden Sie also über den <link...> Tag eine Datei mit Style Sheet-Angaben ein, so brauchen Sie den Bereich <style...>...</style> nicht mehr. Jedoch können Sie wie im folgenden Beispiel auch eine Kombination einbetten.
<html>
<head>
<title>css_144</title>
<link rel=stylesheet type="text/css" href="css_143b.css">
<style type="text/css"><!-- h1 {color:green;}p {font-size:10pt;} //-->
</style>
</head>
<body>
</body>
</html>
So sieht's aus
Hier werden nun beide Arten genutzt, wobei im Konfliktfall die innerhalb von <style...>...</style> definierten Formate Vorrang vor den extern eingebundenen und vererbten Formaten haben. Der Vorteil hierbei liegt darin, dass sie eine Regel über die externe Datei legen und gleichzeitig explizite Formate in der jeweiligen HTML Seite definieren können. Wenn Sie nun in der externen Datei das Element h1 mit blue definiert hätten, so würde der Text der innerhalb von <h1>...</h1> steht nicht blau, sondern wie in der HTML Seite explizit definiert green - also grün dargestellt. Der Text der innerhalb von <p>...</p> steht, wird in diesem Fall nicht wie in der externen Datei definiert mit 14 Punkt, sondern mit 10 Punkt angezeigt.
Verschiedene Eigenschaften können nicht vererbt werden. Eine der wichtigsten Ausnahmen ist die Eigenschaft background. Diese Eigenschaft wird nach der Definition im Element BODY nicht an die eingeschlossenen Elemente weitergegeben. |
|
 |
|
|
