Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Firefox empfiehlt und persönlich versteht CSS-Schreibreihenfolge_CSS/HTML

WBOY
Freigeben: 2016-05-16 12:11:28
Original
1183 Leute haben es durchsucht

In meiner letzten Arbeit bin ich auf viele Probleme gestoßen. Eines davon ist meiner Meinung nach das wichtigste, und das ist die Reihenfolge, in der CSS geschrieben wird. Es kann die Gedanken eines Front-End-Mitarbeiters widerspiegeln. Wenn Sie diesen Artikel sehen, hören Sie bitte auf, das Attribut zu schreiben, das Ihnen in den Sinn kommt.

Werfen wir zunächst einen Blick auf die von Firefox empfohlene Schreibreihenfolge
* Basisstile von mozilla.org
* verwaltet von fantasai
* (Klassen definiert im Markup Guide -http:// mozilla.org /contribute/writing/markup)
*/
/* Empfohlene Reihenfolge:
//Attribute anzeigen
* Anzeige
* Listenstil
* Position
* float
* klar
//Selbstattribut
* Breite
* Höhe
* Rand
* Polsterung
* Rand
* Hintergrund
//Text Attribut
* Farbe
* Schriftart
* Textdekoration
* Textausrichtung
* Vertikalausrichtung
* Leerraum
* anderer Text
* Inhalt
*
*/
Wie Sie an der oben empfohlenen Reihenfolge sehen können, ist es sehr organisiert. Die oben empfohlene Reihenfolge umfasst keine detaillierteren Attribute wie: oben, rechts, unten, links usw. Einige Leute fragen sich vielleicht, ob dies Auswirkungen auf die Leistung hat. Ich weiß es leider nicht entweder, aber ich denke, dass es der richtige Weg ist, die Dinge auf organisierte Weise zu erledigen (vielleicht haben Sie einen besseren Weg).

Mein Verständnis:
1. Anzeigeattribute: display||visibility||list-style(list-style-type, list-style-image, list-style-position)||overflow
2. Positionierungs- und Floating-Attribute: position||top||right||bottom||left||float||clear
3. Box-Modell: width||height||margin||padding||border
4. Hintergrund: Hintergrund (Hintergrundbild, Hintergrundposition, Hintergrundwiederholung, Hintergrundanhang)
5. Textattribute: Schriftart||Schriftart||Schriftstärke||Schriftgröße | |font-family||color
6. Textattribute: text-indent||text-align||vertical-align||letter-spacing||word-spacing||text-transform||text-decoration| text-shadow
7. Andere

Zitieren Sie jemanden: „Ob Sie diese Reihenfolge verwenden oder nicht, ich verwende sie trotzdem.“ Eventuelle Korrekturen sind willkommen

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!