CSS Fibel - Lektion 4
Wenn Du den Abschnitt CSS Properties des CSS Nachschlagewerkes liest, wirst Du sehen, dass es mehrere Wege gibt, um das Ergebnis zu erreichen. Wir haben bereits #FF000 gegenüber red besprochen. Du findest diese Methode auch bei anderen Maßnahmen. (Das passiert, wenn vielen Computerleute Dinge vereinfachen möchten... es wird nur noch KOMPLIZIERTER.)
Der beste Weg, die verschiedenen Eigenschaften zu erlernen, ist es, mit ihnen zu experimentieren. Eine praktische Eigenschaft für den Absatz (<p>) ist das Einrücken...
<HTML>
<HEAD>
<TITLE></TITLE>
<STYLE TYPE="text/css">
P.josh { padding-left:10px }
P.jeff { padding-left:20px; padding-top:30px }
</STYLE>
</HEAD>
<BODY>
<P>Dieser Absatz ist normal.
<P CLASS="josh">Dieser Absatz ist links um 10 Pixel eingerückt.
<P CLASS="jeff">Dieser Absatz ist links um 20 Pixel eingerückt,
und oben zusätzlich um 30 Pixel.
<P>Dieser Absatz ist wieder.
</BODY>
</HTML>
|
Ich glaube jetzt ist ein guter Zeitpunkt, um über den Syntax zu reden. Der grundlegende Syntax ist wie folgt...
element { eigenschaft:wert }
Wenn mehr als eine Eigenschaft geändert werden soll...
element { eigenschaft1:wert; eigenschaft2:wert; eigenschaft3:wert }
Man kann es auch wie ein Satz von Instruktionen schreiben...
element
{
eigenschaft1:wert;
eigenschaft2:wert;
eigenschaft3:wert;
}
|
oder |
element {
eigenschaft1:wert;
eigenschaft2:wert;
eigenschaft3:wert;
}
|
Und, natürlich die Zuweisung von Attributen zu einer Klasse eines bestimmten Elements...
element.meineklasse { eigenschaft:wert }
Übung: Erstelle eine Seite und platziere einen Absatz darin. Verwende Style Sheets, um den Absatz links um 10 Pixel einzurücken, den Hintergrund dunkelrot zu färben und den Text gelb zu färben.
| << Zurück Weiter >> |
 |
 |
