24 gut organisierte CSS-Techniken_Erfahrungsaustausch

Obwohl dieser Aspekt in vielen Dokumenten schon oft erwähnt wurde, machen viele Freunde bei diesen Themen immer noch Fehler. Werfen wir heute einen Blick auf diese CSS-Techniken. Vielleicht verstehen Sie sie nicht vollständig. Ich glaube, Sie werden viel gewinnen.

1. Das ul-Tag hat in Mozilla standardmäßig einen Füllwert, aber im IE hat nur margin einen Wert.
2. Derselbe Klassenselektor kann wiederholt in einem Dokument erscheinen, aber der ID-Selektor kann nur einmal erscheinen. Verwenden Sie sowohl Klasse als auch ID, um eine Bezeichnung in CSS zu definieren. Wenn die Definitionen wiederholt werden, ist die vom ID-Selektor vorgenommene Definition gültig, da die Gewichtung von ID größer ist als die von Klasse.
3. Eine dumme Art, die Kompatibilität anzupassen (IE und Mozilla):
Anfänger können auf eine solche Situation stoßen: Es ist normal, dass dasselbe Label-Attribut im IE als A angezeigt wird, aber es muss in Mozilla angezeigt werden Für eine normale Anzeige muss der Wert auf B eingestellt sein, andernfalls sind die beiden vertauscht.
Vorübergehende Lösung: Der Selektor {attribute name: B !important attribute name: A} funktioniert möglicherweise manchmal nicht. Sie können auf jb51.net nach weiteren BUG-Lösungen suchen.
IV. Wenn zwischen einer Gruppe verschachtelter Tags ein gewisser Abstand erforderlich ist, belassen Sie ihn beim Randattribut des Tags, das sich darin befindet, anstatt den Abstand des Tags außerhalb zu definieren.
5. li-Tag Es wird empfohlen, es zu verwenden Hintergrundbild anstelle von Listenstilbild für die vorherigen Symbole.
6. IE kann den Unterschied zwischen einer Erbschaftsbeziehung und einer Vater-Sohn-Beziehung nicht unterscheiden. Es handelt sich bei allen um Erbschaftsbeziehungen.
7. Vergessen Sie beim Hinzufügen von Selektoren zu Ihren Tags nicht, den Selektoren in CSS Kommentare hinzuzufügen. Sie werden wissen, warum Sie dies tun, wenn Sie Ihr CSS später ändern. Aber Vorsicht: Seien Sie nicht zu verrückt.
8. Wenn Sie ein dunkles Hintergrundbild und einen hellen Texteffekt für eine Beschriftung festlegen. Es wird empfohlen, zu diesem Zeitpunkt eine dunklere Hintergrundfarbe für Ihr Etikett festzulegen. Da die Bilder verloren gehen, bleibt der Text lesbar.
9. Achten Sie bei der Definition der vier Zustände des Links auf die Reihenfolge: Link besucht Hover Aktiv
10. Bitte verwenden Sie Hintergrund für Bilder, die nichts mit dem Inhalt zu tun haben. Denken Sie immer daran, die Präsentation vom Inhalt zu trennen.
11. Die Definition von Farbe kann als #8899FF=#89F abgekürzt werden.
12. Eine Tabelle ist in mancher Hinsicht immer noch nützlich. Wenn Sie auf eine Datentabelle stoßen, hassen Sie sie nicht.
13.

• Wie zeige ich Listen mit HTML und CSS in umgekehrter Reihenfolge an?
• Wie kann verhindert werden, dass Bilder bei der Größenänderung des Browsers unverhältnismäßig schrumpfen?
• Wie kann ich CSS-Animationen mit @-Keyframes dynamisch erstellen, um die Elementrotation basierend auf serverseitigen Werten zu steuern?
• Warum werden meine Stylesheet-Änderungen nach der Aktualisierung nicht angezeigt?
• Wie kann übermäßiger Leerraum zwischen Tabellenzellen browserübergreifend eliminiert werden?