Heim > Web-Frontend > CSS-Tutorial > Praktische Tipps für CSS zur Verbesserung des Frontend-Webseitenlayouts

Praktische Tipps für CSS zur Verbesserung des Frontend-Webseitenlayouts

青灯夜游
Freigeben: 2018-09-07 17:12:09
Original
1283 Leute haben es durchsucht

Es gibt viele Techniken für das CSS-Frontend-Webseitenlayout. Hier finden Sie eine Zusammenfassung von CSS-Frontend-Webseiten-Layout-Tipps, die für Anfänger geeignet sind und möglicherweise einen praktischeren Referenzwert für Sie darstellen:

1 Das ul-Tag hat in Mozilla standardmäßig einen Füllwert. und in Mozilla hat es einen Füllwert. Im IE hat nur margin einen Wert.

2. Derselbe Klassenselektor kann wiederholt in einem Dokument erscheinen, aber der ID-Selektor kann nur einmal erscheinen, um eine Bezeichnung in CSS zu definieren Definitionen ist die vom ID-Selektor vorgenommene Definition gültig, da die Gewichtung von ID größer als CLASS ist.

3. Eine dumme Möglichkeit, die Kompatibilität anzupassen (IE und Mozilla):
Anfänger können auf eine solche Situation stoßen: Die Attribute derselben Bezeichnung sind im IE festgelegt Es ist normal, es als A anzuzeigen, aber in Mozilla muss es auf B eingestellt werden, um es normal anzuzeigen, sonst sind die beiden umgekehrt.
Vorübergehende Lösung:

选择符{属性名:B !important;属性名:A}
Nach dem Login kopieren

4. Wenn zwischen einer Gruppe von zu verschachtelnden Tags ein gewisser Abstand erforderlich ist, belassen Sie ihn beim Randattribut des Tags, das sich im Inneren befindet, anstatt das Tag, das sich außerhalb befindet, zu definieren des Tags
5. Es wird empfohlen, für das Symbol vor dem li-Tag „background-image“ anstelle von „list-style-image“ zu verwenden.
6. IE kann den Unterschied zwischen Vererbungsbeziehung und Eltern-Kind-Beziehung nicht unterscheiden.
7. Vergessen Sie beim Hinzufügen von Selektoren zu Ihren Tags nicht, Kommentare zu den Selektoren in CSS hinzuzufügen. Sie werden wissen, warum Sie dies tun, wenn Sie Ihr CSS in Zukunft ändern.

8. Wenn Sie ein dunkles Hintergrundbild und einen hellen Texteffekt für eine Beschriftung festlegen. Es wird empfohlen, zu diesem Zeitpunkt eine dunkle Hintergrundfarbe für Ihr Etikett festzulegen.

9. Achten Sie bei der Definition der vier Zustände des Links auf die Reihenfolge:

Link Visited Hover Active
Nach dem Login kopieren

10. Bitte verwenden Sie Hintergrund<🎜 das hat nichts mit dem Inhalt zu tun. >

11. Die definierte Farbe kann mit #8899FF=#89F abgekürzt werden.

12 in einigen Aspekten. Bitte verwenden Sie es dort, wo eine Spaltenausrichtung erforderlich ist.

13.

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage