HTML5 Tag 4 Notizen

Selektor:

1, Beziehungsselektor

1) Gruppenselektor h2,p,.text,#box{style}

durch Kommas trennen Öffnen

2) Untergeordnetes Elementselektor, übergeordnetes Element > untergeordnetes Element {style}

, getrennt durch Größer-als-Zeichen > >Mit Leerzeichen trennen



Farben werden vererbt

2 , dynamischer Pseudoklassenselektor (häufig in Tags verwendet)

: Linkstatus beim Verlinken

: Besuchsstatus nach dem Besuch

: Hover-Status, wenn die Maus platziert wird

: aktiv Der Zustand, wenn die Maus angeklickt wird

Prinzip: Love Hate Prinzip LoVeHAte schreibt dies der Reihe nach

Im Allgemeinen schreibe a{} a:hover{}

3, :nth Selektor

:first-child:erstes untergeordnetes Element

:last-child:last child element

:nth-child( n): n-tes untergeordnetes Element n: 0, 1,2...n 2n 2n+1... Beginnend bei 0, jedes Mal akkumulierend 1

Ungerade und gerade Zeilen haben unterschiedliche Farben: :nth-child(2n +1) nth-child( 2n)

CSS-Eigenschaften

1, Texteigenschaften (Textstil, Schriftarteigenschaften, Schriftstil)

font-size:12px/14px ; Schriftgröße (Browser-Standardtext). Größe 16px)

Schriftfamilie:Microsoft Yahei;

Schriftstärke:100-900/fett/fett/normale Schriftart fett

Farbe:#000000;

font-style:italic(italic)/normal;

2, Absatzattribut

text-align:left/center/right Text horizontale Ausrichtung

vertikal -align:top/middle/bottom Text vertikale Ausrichtung

text-indent:20px/2em Text indent

line-height:20 -24px/150%/1,5 Zeilenabstand

Textdekoration: unterstrichen/überstrichen/durchgestrichen/keine Textdekoration

Besondere Verwendung:

Einstellungsmethode für eine Textzeile mit Höhe und vertikaler Zentrierung:

line-height:height; (line height = height)

letter-spacing:10px; word Der Abstand zwischen Wörtern

word-spacing:1px; Der Abstand zwischen Wörtern (meistens verwendet). Englische Websites)

text-transform:capitalize (der erste Buchstabe jedes Wortes wird großgeschrieben) Uppercase (alles in Großbuchstaben) Lowercase (alles in Kleinbuchstaben) (wird hauptsächlich auf englischen Websites verwendet)

white-space :normal/nowrap (keine Zeilenumbrüche)

3, Hintergrundattribut (Hintergrund)

background-color:#000000/rgba()/red

background-image: url(Bildpfad)

background-repeat:repeat/repeat-x/repeat-y/no -repeat; (Stellen Sie die Anzeigemethode des Hintergrundbilds ein)

background-position: horizontal Richtung vertikale Richtung

horizontale Richtung: +300px -300px 20 % links Mitte rechts

vertikale Richtung: +300px -300px 20 % oben Mitte unten

Hintergrund ist ein zusammengesetztes Attribut , können Sie das - danach weglassen.

Beispiel: Hintergrund:#ff0000 url(../img/1.jpg) no-repeat 20px 30px;

4, Listenattribut (Listenstil), zusammengesetztes Attribut (hauptsächlich verwendet für ul ol li)

list-style-image:url();Fügen Sie das Bild vor dem Listenelement hinzu

list-style-type:none (Punkt vor der Liste)

list-style-position: inside/outside

list-style:none; am häufigsten verwendet

Das Obige ist der Inhalt der Notizen am vierten Tag von HTML5 . Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!