Einige sehr gute CSS-Kenntnisse, die jedoch vom people_Experience-Austausch oft ignoriert werden

1. Groß-/Kleinschreibung beachten
Bei der Verwendung von CSS in XHTML wird bei den in CSS definierten Elementnamen die Groß-/Kleinschreibung beachtet. Um diesen Fehler zu vermeiden, empfehle ich, für alle Definitionsnamen Kleinbuchstaben zu verwenden.

2. Keine Anführungszeichen zum Hintergrundbildpfad erforderlich
Um Bytes zu sparen, empfehle ich, keine Anführungszeichen in den Hintergrundbildpfad einzufügen, da die Anführungszeichen nicht erforderlich sind. Zum Beispiel:

background:url("images/***.gif") #333;

kann geschrieben werden als

background:url(images/***.gif) #333;

Wenn Sie Anführungszeichen hinzufügen , Im Gegenteil, es führt zu einigen Browserfehlern


3 Geben Sie Link-Stile in der richtigen Reihenfolge an
Wenn Sie CSS zum Definieren mehrerer Statusstile von Links verwenden, achten Sie darauf, wie diese sind Die richtige Reihenfolge ist: :link :visited :hover :active, den Sie sich als „LoVe HAte“ (like to hate) merken können Das CSS-Problem besteht darin, dass beim Positionieren von Floats die darunter liegende Ebene von der Floating-Ebene abgedeckt wird oder die in der Ebene verschachtelte Unterebene den Umfang der äußeren Ebene überschreitet.

Normalerweise besteht die Lösung darin, ein zusätzliches Element hinzuzufügen hinter der schwebenden Ebene, wie einem div oder einem br, und definieren Sie ihren Stil als klar: Diese Methode ist etwas weit hergeholt. Siehe diesen Artikel „Floats ohne strukturelles Markup löschen“ (Hinweis: Diese Website wird diesen Artikel so schnell wie möglich übersetzen)

Die beiden oben genannten Methoden können das Problem des Floating-Überlaufs sehr gut lösen, aber wenn Sie die Ebene wirklich korrigieren müssen. Oder was ist zu tun, wenn Objekte in einer Ebene gelöscht werden? Eine einfache Methode ist die Verwendung des Überlaufattributs. Diese Methode wurde ursprünglich in „Simple Clearing of Floats“ veröffentlicht und wurde häufig in der Diskussion „Clearance“ und „Super Simple Clearing Floats“ verwendet .

Welche der oben genannten klaren Methoden für Sie besser geeignet ist, hängt von der spezifischen Situation ab, und ich werde sie hier nicht diskutieren. Außerdem habe ich Ihnen bereits einige ausgezeichnete Artikel zum Lesen empfohlen : „Floatutorial“, „Containing Floats“ und „Float Layouts“


5. Horizontale Zentrierung (Zentrierung)
Dies ist eine einfache Technik, aber es lohnt sich, sie noch einmal zu erwähnen, weil ich sie gesehen habe Viele Fragen von Neulingen stellen sich wie folgt: Wie zentriere ich CSS horizontal? > text-align:center;
}
#wrap {
width:760px /* Ändern Sie die Breite Ihrer Ebene*/
margin:0 auto;
text-align:left;
}


6. Debugging-Fähigkeiten: Wie groß ist die Ebene?
Beim Debuggen eines CSS-Fehlers muss ich normalerweise eine Hintergrundfarbe auf der problematischen Ebene definieren Es ist leicht zu lösen, wie viel Platz die Ebene einnimmt. Einige Leute schlagen vor, den Rand zu verwenden, aber das Problem besteht darin, dass der Rand das Element manchmal vergrößert und der Rand oben und unten zerstört wird der vertikale Randwert, also verwenden Sie den Hintergrund, um sicherer zu sein