Eine Zusammenfassung der Benennungsregeln für HTML- und CSS-Tags

Der Ordner

erstellt hauptsächlich die folgenden Ordner:
1. Bilder speichert einige häufig verwendete Bilder auf Websites
3. Flash speichert einige Flash-Dateien; 4. PSD speichert einige PSD-Quelldateien > Hinweis: Diese CSS-Benennungsregel ist nur für den Objekttabellen-Produktionsmodus geeignet
1. Die CSS-Dateien werden im CSS-Ordner mit dem Namen css.css abgelegt
2. Hauptstildefinition: body, table, td, tr , a
　3. Linkstildefinition: link_white (weiß); link_blue (blau) usw.; Wenn es Wiederholungen gibt, fügen Sie danach arabische Ziffern hinzu; wie zum Beispiel: linkred
　4. Textstildefinition: Font_red (rot); Font_red_14 (rote 14-Punkt-Schriftart); ; border_red_blr (rot border_red_lr (rote linke und rechte Seite); border_red_b (rote untere Seite) usw.;
6. Formularstildefinition: text_100 (Textfeldbreite ist 100); textarea_200_red (Textbereichsbreite ist 200) (mit rotem Rand); select_100 (Listenbreite ist 100); button_150 (Buttonbreite 150);
Hinweis: Das Formular wird durch die Breite definiert und das längste Wort im Namen ist: „text_100_red“
Linienstildefinition: line_X (horizontale Linie); line_X_red (rote horizontale Linie);
　8 , Andere Stildefinitionen: Hier definieren wir hauptsächlich einige personalisierte Stile; .html Kategorieverschachtelte Dateien
Article_channel.asp Article_Channel-Seite
Article_list.asp Article_list-Seite
Article_detail.asp Article_display-Seite
Hinweis: Wenn mehrere Artikelkanäle vorhanden sind, verwenden Sie Article01, Article02, Article03 usw.
　exhibit_channel.asp Exhibition Information_Channel Page
　exhibit_list.asp Exhibition Information_List Page
　exhibit_detail.asp Exhibition Information_Display Page
　product_channel.asp Product Center_Channel Page
Product_list.asp Product Center_list Seite
product_detail. ASP Product Center_Display-Seite
corporate_channel.asp Member_Channel-Seite
corporate_list.asp Member_list-Seite
corporate_detail.asp member_ Display-Seite
Information_channel.asp Business Opportunity Information_Channel-Seite
Information_list.asp Business Opportunity Information_List-Seite
Informationen zu Geschäftsmöglichkeiten Seite
hr_detail.asp Job Search_Display-Seite
job_hr_channel. asp Talent Center_Channel-Seite
job_hr_lisr.asp Talent Center_List-Seite
job_hr_detail.asp Talent Center-Anzeigeseite
copyright.asp Copyright-Seite
Bild Benennung
1. Navigationsbenennung: menu.gif wie: menug .gif (Hintergrundbild der Navigation)
2. Mitglieder-Login: login.gif wie: loginbg.gif (Hintergrundbild der Mitglieder-Login)
3. Suchbenennung: search.gif, z. B. search_bg. gif (Hintergrundbild suchen)
4. Kleines Symbol: ico_number.gif, z. B.: ico_001.gif
5. Zeilenbenennung: line_X_color.gif, z. B : line_X_red.gif (rote horizontale gepunktete Linie) Beschreibung: Linie benennt nur gepunktete Linien
line_Y_red.gif (rote vertikale gepunktete Linie)
6. Benennung der Werbung: ad_number.gif Wie zum Beispiel: ad001.gif
7 . Bilder in anderen Spalten: der erste im Spaltennamen Buchstaben.gif
Zum Beispiel: xwzx_bg.gif (Hintergrund des Newscenters) cpzx_l.gif (linkes Bild des Produktcenters)
8. Heiße Bilder von Produkten und Spalten: pic_number.gif Zum Beispiel: pic_001.gif
Hinweis: Oben, unten, links und rechts können als T, B, L, R abgekürzt werden
CSS-standardisierte Designbenennung
1. Beispiel einer Namenskonvention für Klasse
Kopfzeile: Kopfzeile
Inhalt: Inhalt /Container
Schwanz: Fußzeile
Navigation: Navigation
Seitenleiste: Seitenleiste
Spalte: Spalte
Seitenperipheriesteuerung Gesamtlayoutbreite: Wrapper
Linke und rechte Mitte: links-rechts-Mitte
Login-Leiste: loginbar
Logo: logo
Werbung: Banner
Seitentext: Hauptseite
Hotspot: hot
News: news
Herunterladen: herunterladen
Unternavigation: Unternavigation
Menü: Menü
Untermenü: Untermenü
Suche: Suche
Freundlicher Link: Friendlink
Fußzeile: Fußzeile
Urheberrecht: Urheberrecht
Scrollen: scrollen
Inhalt: Inhalt
Tag-Seite: Tab
Artikelliste: Liste
Eingabeaufforderung: msg
Tipps: Tipps
Spaltentitel: Titel
Beitritt: joinus
Guide: Gilde
Dienst: service
Registrierung: regsiter
Status: status
Abstimmung: vote
Partner: Partner
2 . Schreibmethode für Kommentare
/ Fußzeile /
Inhaltsbereich
/ Endfußzeile /
3. Beispiel für eine ID-Namenskonvention
(1) Seitenstruktur
Container: Container
Kopfzeile : Kopfzeile
Inhalt: Inhalt/Container
Seitenkörper: Hauptseite
Fußzeile: Fußzeile
Navigation: Navigation
Seitenleiste: Seitenleiste
Spalte: Spalte
Seitenrand Steuern Sie das Gesamtlayout Breite: Wrapper
Links-rechts-Mitte: Links-rechts-Mitte
(2) Navigation
Navigation: nav
Hauptnavigation: mainbav
Unternavigation: subnav
Navigation oben: topnav
Seitennavigation: Seitenleiste
Linke Navigation: linke Seitenleiste
Rechte Navigation: rechte Seitenleiste
Menü: Menü
Untermenü: Untermenü
Titel: Titel
Zusammenfassung: Zusammenfassung
(3 ) Funktion
Logo: Logo
Werbung: Banner
Login: Login
Login-Leiste: Loginbar
Registrierung: Regsiter
Suche: Suche
Multifunktionsleiste: Shop
Titel: Titel
Beitreten: joinus
Status: status
Button: btn
Scrollen: scrollen
Tab: tab
Artikelliste: list
Eingabeaufforderung: msg
Aktuell: aktuell
Tipps: Tipps
Symbol: Symbol
Hinweis: Hinweis
Anleitung: Gilde
Service: Service
Hotspot: hot
News: News
Download: Download
Abstimmung: Abstimmung
Partner: Partner
Freundlicher Link: Link
Urheberrecht: Copyright
4. Beispiele für Klassenschreibspezifikationen
(1) Farbe: Verwenden Sie einen Farbnamen oder einen Hexadezimalcode, z. B.

.red { color： red； }
　　.f60 { color： #f60； }
　　.ff8600 { color： #ff8600； }

(2) Schriftgröße, verwenden Sie direkt „Schriftgröße“ als Namen, z. B.

.font12px { font-size： 12px； }
　　.font9pt {font-size： 9pt； }

(3) Ausrichtungsstil, verwenden Sie den englischen Namen von B.

　

.left { float：left； }
　　.bottom { float：bottom； }

(4) Titelleistenstil, verwenden Sie zum Benennen die Methode „Kategoriefunktion“, z. B.

.barnews { }
　　.barproduct { }

5 . CSS-Dateibenennungsbeispiel

Main master.css
Module module.css
Basic common base.css
Layout, Layout theme.css
Columns columns.css
Textfont.css
Formulare.css
Patch mend.css
Drucken print.css
6. Notizen
(1) Alle Kleinbuchstaben ; Verwenden Sie so oft wie möglich Englisch;
(3) Fügen Sie keine Bindestriche oder Unterstreichungen hinzu
(4) Versuchen Sie, Wörter nicht abzukürzen, es sei denn, es handelt sich um Wörter, die auf den ersten Blick leicht zu verstehen sind

Das obige ist der detaillierte Inhalt vonEine Zusammenfassung der Benennungsregeln für HTML- und CSS-Tags. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!