Einführung in HTML+CSS-Benennungsregeln-HTML-Tutorial-php.cn

Einführung in HTML+CSS-Benennungsregeln

零下一度

Freigeben： 2017-07-23 13:21:52

Original

1726 Leute haben es durchsucht

HTML+CSS-Benennungsregeln

In einer HTML-Seite mit viel Inhalt ist es notwendig, viele verschiedene Frames zu entwerfen und diese verschiedenen Frames und Inhalte dann zu klassifizieren und zu geben entsprechenden Namen, wodurch die Struktur der Webseite übersichtlicher wird und die Arbeit erleichtert wird. Wenn viele unerfahrene Freunde eine HTML-Datei entwerfen, geben sie möglicherweise nur einige einfache Namen an, die auf ihren eigenen Ideen basieren. Wenn sie jedoch blind zufällige Namen vergeben, wird dies für die Teammitglieder nicht nur schwierig, sondern führt auch zu verwirrenden Bezeichnungen Dies macht die Codepflege sehr schwierig und für das Management sehr ungünstig. Daher sollten wir beim Entwerfen der gesamten Website oder einer separaten HTML-Seite gute Namensregeln haben. In diesem Artikel erklären wir hauptsächlich die CSS-Benennungsregeln, zu denen auch die Benennung von HTML-Tags gehört.

Der Dateiname muss mit einem englischen Buchstaben beginnen. Die übliche Benennungsregel besteht darin, ihn in englische Wörter zu übersetzen und diese entsprechend der Klassifizierung des Inhalts und der Art des Rahmens zu benennen „nav“ (bedeutet, dass dieses Div eine Navigationsleiste ist), alle Wörter sollten in Kleinbuchstaben geschrieben sein, und im Namen können Zahlen oder Unterstriche verwendet werden, zum Beispiel: div="main_piclist" (stellt die Bilderliste unter dem Hauptinhalt dar). ), div="nav_bg.jpg" (stellt das Hintergrundbild der Navigationsleiste dar) , Sie können auch den Bindestrich verwenden, um die Namen zu verbinden, zum Beispiel: div="main-left" (zeigt das Layout des Inhalts auf der an (links) Bei allen Namen sollte versucht werden, die Verwendung chinesischer Schriftzeichen zu vermeiden und möglichst wenige Buchstaben zu verwenden, um eine möglichst einfache Verständlichkeit zu erreichen. Versuchen Sie, sie nicht abzukürzen, es sei denn, die Bedeutung ist auf den ersten Blick leicht zu verstehen.

HTML-Tag-Benennung/CSS-standardisierte Benennungsliste

Benennung der Seitenstruktur

Seite: Stellt dar Die gesamte Seite wird für die äußerste Ebene verwendet.
wrapper: Mantel, ein peripheres Paket, das alle Elemente zusammenwickelt und für die äußerste Schicht verwendet wird
wrapper: Seitenperipherie steuert die gesamte Layoutbreite , wird für die äußerste Schicht verwendet
Container: ein Gesamtcontainer, der für die äußerste Schicht verwendet wird
Kopf, Kopfzeile: Kopfbereich, verwendet für Kopfzeile
nav: Navigationsleiste
Inhalt: Inhalt, der wichtigste Inhaltsbereich auf der Website, der für den mittleren Teil des Webs verwendet wird Seite
Hauptbereich: der Hauptbereich auf der Website (mit Angabe der wichtigsten Position), der für den zentralen Hauptinhalt verwendet wird
Spalte: Spalte
Seitenleiste: Seitenleiste
Fuß, Fußzeile: Fußzeile, Fußzeile. Einige zusätzliche Informationsplatzierungsbereiche auf der Website (oder mit dem Namen Copyright) werden unten

Navigation mit dem Namen

nav, navbar, navigation, nav-wrapper: Navigationsleiste oder Navigationspaket, das die horizontale Navigation darstellt
topnav: obere Navigation
mainbav: Hauptnavigation
Unternavigation: Unternavigation
Seitenleiste: Seitennavigation
linke Seitenleiste oder Seitenleiste_a: links Navigation
rightsidebar oder sidebar_b: rechte Navigation
title: title
summary: summary/ li>
Menü: Menü. Bereich enthält allgemeine Links und Menüs
Untermenü: Untermenü
Drop: Dropdown
dorpmenu: Dropdown-Menü
Links: Link-Menü

Funktionsbenennung

Logo: Markieren Sie die Website-Logo-Markierung
Banner: Slogan, Werbebanner, Top-Werbebanner
Login: Login, ( wie Anmeldeformular: Formular-Anmeldung)
Anmeldeleiste: Anmeldeleiste
Registrierung: Registrierung
Werkzeug, Symbolleiste: Symbolleiste
Suche: Suche
Suchleiste: Suchleiste
Sucheingabe: Sucheingabefeld
Shop: Band, das den aktuellen
Symbol: kleines Symbol

CSS-Stilbenennung

Ausrichtungsstilbenennung: links (linker Inhalt), zentriert (mittlerer Inhalt), rechts (rechter Inhalt). ) ), usw.;
Englische Benennung von Farben: rot (rot), grün (grün), gelb (gelb) oder border_red (roter Rand) usw.; >
Farbcode-Benennung: f00 (rot), ff0 (gelb), f90 (orange) usw.;
Textgrößenbenennung: Schriftart 12px ( Schriftart 12 Pixel), Schriftart 16 Pixel ( Schriftart 16 Pixel) usw.;
Seitenzeilenbenennung: line_x (horizontale Linie), line_y (vertikale Linie) oder line_red (rote Linie), line_black (schwarze Linie)
Benennung der Bildsymbole: pic_1.jpg, pic_2.jpg oder ico_1.gif, ico_2.gif
Benennung der Seitenanzeige : ad_01, ad_02
Benennung des Hintergrundrahmens: nav_bg (repräsentiert die Position des Hintergrundbilds der Navigationsleiste), tool_bg (repräsentiert die Position des Hintergrundbilds der Symbolleiste)

CSS-Stylesheet-Benennung

index.css: Erstellen Sie einen separaten Stil für die Homepage
head.css: Kopfzeilenstil, mehrseitiges Kopfzeilendesign. Wird verwendet, wenn die Stile gleich sind.
base.css: gemeinsamer Stil.
style.css: Stildatei, die von unabhängigen Seiten verwendet wird.
global.css: Seitenstilbasis, globaler öffentlicher Stil, muss in die Seite eingebunden werden.
layout.css: Layout, Layoutstil, wird verwendet, wenn es viele gängige Typen gibt, im Allgemeinen in Homepage-Seiten und Produktseiten
Modul .css: Modul, das für Produktseiten verwendet wird und auch in Verbindung mit anderen Stilen verwendet werden kann.
master.css: Haupt-Stylesheet
columns.css: Spaltenstile
Themen .css: Körperstil
forms.css: Formularstil
mend.css: Patch, privatisierter Patch basierend auf dem oben genannten Stil.

Das obige ist der detaillierte Inhalt vonEinführung in HTML+CSS-Benennungsregeln. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!