1. Grundlegende Grammatikspezifikationen
Analysieren Sie eine typische CSS-Anweisung:
p {FARBE:#FF0000;HINTERGRUND:#FFFFFF}
Unter diesen wird „p“ als „Selektor“ bezeichnet, was darauf hinweist, dass wir den Stil für „p“ definieren möchten.
Stildeklarationen werden in zwei geschweiften Klammern „{}“ geschrieben;
FARBE und HINTERGRUND werden als „Eigenschaften“ bezeichnet, und verschiedene Eigenschaften werden durch Semikolons „;“ getrennt.
„#FF0000“ und „#FFFFFF“ sind die Werte der Attribute.
2. Farbwert
Farbwerte können in RGB-Werten geschrieben werden, zum Beispiel: color : rgb(255,0,0), oder hexadezimal, wie im obigen Beispiel color:#FF0000. Wenn die Hexadezimalwerte paarweise wiederholt werden, können sie mit dem gleichen Effekt abgekürzt werden. Beispiel: #FF0000 kann als #F00 geschrieben werden. Es kann jedoch nicht abgekürzt werden, wenn es sich nicht wiederholt. Beispielsweise muss #FC1A1B mit sechs Ziffern gefüllt werden.
3. Definieren Sie die Schriftart
Webstandards empfehlen die folgenden Methoden zur Schriftartdefinition:
body {Schriftfamilie: „Lucida Grande“, Verdana, Lucida, Arial, Helvetica, 宋体,sans-serif }
Schriftarten werden in der aufgeführten Reihenfolge ausgewählt. Wenn der Computer des Benutzers die Schriftart Lucida Grande enthält, wird das Dokument als Lucida Grande bezeichnet. Wenn nicht, wird sie als Verdana-Schriftart bezeichnet, wenn es keine Verdana gibt, wird sie als Lucida-Schriftart bezeichnet und so weiter;
Die Schriftart Lucida Grande ist für Mac OS X geeignet;
Die Schriftart Verdana ist für alle Windows-Systeme geeignet;
Lucida ist für UNIX-Benutzer geeignet
„Song Ti“ ist für Benutzer des vereinfachten Chinesisch geeignet;
Wenn keine der aufgelisteten Schriftarten verfügbar ist, wird garantiert die standardmäßige serifenlose Schriftart aufgerufen;
4.Gruppenauswahl
Wenn mehrere Elemente die gleichen Stilattribute haben, kann eine Anweisung zusammen aufgerufen werden und die Elemente werden durch Kommas getrennt: p, td, li { Font-Size: 12px }
5. Leiten Sie Selektoren ab
Sie können abgeleitete Selektoren verwenden, um Stile für untergeordnete Elemente innerhalb eines Elements zu definieren, zum Beispiel:
li strong {Schriftart: kursiv; Schriftgröße: normal;
Es soll einen kursiven, aber nicht fetten Stil für das starke Unterelement unter li definieren.
6.id-Selektor
Das Layout mit CSS wird hauptsächlich über die Ebene „div“ implementiert, und der Stil des div wird über den „id selector“ definiert. Beispielsweise definieren wir zunächst eine Ebene
<div id="menubar"></div>
Definieren Sie es dann im Stylesheet wie folgt:
#menubar {MARGIN: 0px;HINTERGRUND: #FEFEFE;FARBE: #666;}
Wobei „menubar“ der von Ihnen definierte ID-Name ist. Beachten Sie das „#“-Zeichen davor.
Der ID-Selektor unterstützt auch die Ableitung, zum Beispiel:
#menubar p { text-align : right; 10px }
Diese Methode wird hauptsächlich verwendet, um komplexere Ebenen und Elemente zu definieren, die über mehrere abgeleitete Elemente verfügen.
6. Kategorieauswahl
Verwenden Sie in CSS einen Punkt, um die Kategorieauswahldefinition anzugeben, zum Beispiel:
.14px {Farbe: #f60; Schriftgröße: 14 Pixel;}
Verwenden Sie auf der Seite die Methode class="category name", um Folgendes aufzurufen:
<span class="14px">Schriftartgröße 14px</span>
Diese Methode ist relativ einfach und flexibel und kann jederzeit entsprechend den Seitenanforderungen erstellt und gelöscht werden.
7. Definieren Sie den Stil des Links
In CSS werden vier Pseudoklassen verwendet, um Link-Stile zu definieren, nämlich: a:link, a:visited, a:hover und a:active, zum Beispiel:
a:link{Schriftstärke: fett; Textdekoration: keine; Farbe: #c00;}
a:visited {Schriftstärke: fett; Textdekoration: keine; Farbe: #c30;}
a:hover {Schriftstärke: fett; Textdekoration: unterstrichen; Farbe: #f60;}
a:active {Schriftstärke: fett; Textdekoration: keine; Farbe: #F90;}
Die obigen Anweisungen definieren jeweils die Stile von „Links, besuchten Links, wenn die Maus darüber ist und wenn die Maus angeklickt wird“. Beachten Sie, dass Sie in der oben genannten Reihenfolge schreiben müssen, da die Anzeige sonst möglicherweise anders ausfällt als erwartet. Denken Sie daran, dass die Reihenfolge „LVHA“ lautet.
Haha, nachdem ich so viel gelesen habe, wird mir tatsächlich ein wenig schwindelig. Hier sind nur einige häufig verwendete Spezifikationen. Schließlich gehen wir Schritt für Schritt vor und es ist unmöglich, dick zu werden in einem Bissen :)