Unverzichtbare CSS-Leitfäden

Der folgende Editor stellt Ihnen einen unverzichtbaren CSS-Leitfaden zur Verfügung. Der Herausgeber findet es ziemlich gut, deshalb werde ich es jetzt mit Ihnen teilen und es allen als Referenz geben. Kommen Sie und werfen Sie einen Blick mit dem Editor

Kapitel 1 CSS und Dokumente

1, Element: Ersatzelement (IMG-Eingabe), nicht Ersetzen Elemente (die meisten Bereiche).

2, Link: rel (repräsentative Beziehung: Stylesheet, Kandidaten-Stylesheet: alternatives Stylesheet); Typ (Text/CSS); Titel (koordinierender Kandidat). ).

3, @import url(sheet1.css) muss innerhalb von style verwendet werden, platziert vor anderen CSS-Regeln

4, Rückwärtszugänglichkeit: , sodass ältere Browser den Style ignorieren und das Stylesheet normal lesen können

5, CSS-Kommentare: /* */ 🎜>

Kapitel 2 Selektoren

h1[class=''] zu schreiben. {...} Genaue Übereinstimmung

h1[class~=''] {...} Teilweise Übereinstimmung [class^=''] Was bedeutet [class$ beginnt mit =''] und endet mit was [ class*=''] enthält alle Elemente

*[lang|='en']Ein spezifischer Attributselektor, der das lang-Attribut gleich „en“ oder beginnend mit „en“ auswählt.

5, wählen Sie das untergeordnete Element aus: h1>strong; wählen Sie das benachbarte Geschwisterelement h1+p aus (h1 und p haben ein gemeinsames übergeordnetes Element und wählen Sie schließlich p) aus. Link-Pseudoklasse: nicht besuchter Link: Link, besuchter Link: besucht (beide sind statisch), äquivalent zu Klasse kann für jedes Element verwendet werden)

Empfohlene Pseudoklassenreihenfolge: link-visited-focus-hover-active Das erste untergeordnete Element (:first-child), das leicht missverstanden werden kann, ist alles erste untergeordnete Elemente (im folgenden Beispiel umfassen die Elemente als erste untergeordnete Elemente das erste p, das erste li sowie strong und em).

<p>
    <p>helooo</p>
    <ul>
        <li>111</li>
        <li><strong>222</strong></li>
    </ul>
    <p>
        <em>333</em>
    </p>
</p>