Heim >Web-Frontend >HTML-Tutorial >Vollständige Liste der Div+CSS-Namenskonventionen
1. Beschreibung der Benennungsregeln: - TOP
1), alle Namen sollten in Kleinbuchstaben geschrieben sein
2), Attributwerte müssen in doppelte Anführungszeichen gesetzt werden ("") und müssen sein Es muss einen Wert wie class="divcss5", id="divcss5"
3 haben), jedes Tag muss einen Anfang und ein Ende haben und die richtige Ebene haben, und das Layout muss regelmäßig und ordentlich sein
4), leere Elemente Es muss ein End-Tag oder „/“ nach dem Anfangs-Tag stehen
5). , Rahmen usw.
6),
Coat Wrap ---wird verwendet für die äußerste Ebene
Header ----------------wird für den Kopf verwendet
Hauptinhalt main------------wird für den Hauptinhalt verwendet (mittlerer Teil)
Linker Hauptteil-links -------------Linkes Layout
Rechter Hauptteil-rechts ----------Rechtes Layout
Navigationsleiste nav -------------------Navigationsleiste des Webseitenmenüs
Inhalt --------------- Wird für den Mittelteil des verwendet Webseite
Untere Fußzeile --------------- wird für unten verwendet
3. DIV+CSS-Benennungsreferenztabelle: - TOP
Das Folgende ist im CSS-Stil Benennungs- und CSS-Dateien Benennungsreferenztabelle, DIV-CSS-Benennungssammlung:
| CSS样式命名 | 说明 |
|---|---|
| 网页公共命名 | |
| #wrapper | 页面外围控制整体布局宽度 |
| #container或#content | 容器,用于最外层 |
| #layout | 布局 |
| #head, #header | 页头部分 |
| #foot, #footer | 页脚部分 |
| #nav | 主导航 |
| #subnav | 二级导航 |
| #menu | 菜单 |
| #submenu | 子菜单 |
| #sideBar | 侧栏 |
| #sidebar_a, #sidebar_b | 左边栏或右边栏 |
| #main | 页面主体 |
| #tag | 标签 |
| #msg #message | 提示信息 |
| #tips | 小技巧 |
| #vote | 投票 |
| #friendlink | 友情连接 |
| #title | 标题 |
| #summary | 摘要 |
| #loginbar | 登录条 |
| #searchInput | 搜索输入框 |
| #hot | 热门热点 |
| #search | 搜索 |
| #search_output | 搜索输出和搜索结果相似 |
| #searchBar | 搜索条 |
| #search_results | 搜索结果 |
| #copyright | 版权信息 |
| #branding | 商标 |
| #logo | 网站LOGO标志 |
| #siteinfo | 网站信息 |
| #siteinfoLegal | 法律声明 |
| #siteinfoCredits | 信誉 |
| #joinus | 加入我们 |
| #partner | 合作伙伴 |
| #service | 服务 |
| #regsiter | 注册 |
| arr/arrow | 箭头 |
| #guild | 指南 |
| #sitemap | 网站地图 |
| #list | 列表 |
| #homepage | 首页 |
| #subpage | 二级页面子页面 |
| #tool, #toolbar | 工具条 |
| #drop | 下拉 |
| #dorpmenu | 下拉菜单 |
| #status | 状态 |
| #scroll | 滚动 |
| .tab | 标签页 |
| .left .right .center | 居左、中、右 |
| .news | 新闻 |
| .download | 下载 |
| .banner | 广告条(顶部广告条) |
| 电子贸易相关 | |
| .products | 产品 |
| .products_prices | 产品价格 |
| .products_description | 产品描述 |
| .products_review | 产品评论 |
| .editor_review | 编辑评论 |
| .news_release | 最新产品 |
| .publisher | 生产商 |
| .screenshot | 缩略图 |
| .faqs | 常见问题 |
| .keyword | 关键词 |
| .blog | 博客 |
| .forum | 论坛 |
| CSS文件命名 | 说明 |
|---|---|
| master.css,style.css | 主要的 |
| module.css | 模块 |
| base.css | 基本共用 |
| layout.css | 布局，版面 |
| themes.css | 主题 |
| columns.css | 专栏 |
| font.css | 文字、字体 |
| forms.css | 表单 |
| mend.css | 补丁 |
| print.css | 打印 |
CSS-Stilbenennung Beschreibung
Öffentliche Benennung der Webseite
#wrapper Seitenperipheriesteuerung Gesamtlayoutbreite
#container oder # Inhaltscontainer, der für die äußerste Ebene verwendet wird
#Layout-Layout
#Kopf, #Kopfzeile, Kopfteil
#Fuß, #Fußzeile, Fußzeile
#nav primäre Navigation
#subnav sekundäre Navigation
#menu menu
#submenu submenu
#sideBar sidebar
#sidebar_a, #sidebar_b linke oder rechte Spalte
#main page body
#tag tag
# msg #message prompt information
#Tipps Tipps
#Vote Vote
#Friendlink Friendly Connection
#Titel Titel
#Zusammenfassung
#Loginbar Login-Leiste
#SucheEingabe Sucheingabefeld
# hot Hotspot
#search Search
#search_output Suchausgabe und Suchergebnisse sind ähnlich
#searchBar Suchleiste
#search_results Suchergebnisse
#copyright Urheberrechtsinformationen
#branding Trademark
#logo Website-LOGO
#siteinfo Website-Informationen
#siteinfoLegal Legal Statement
#siteinfoCredits Reputation
#joinus Treten Sie uns bei
#partner Partner
#service Service
#regsiter-Registrierung
arr/arrow Pfeil
#Gildenführer
#Sitemap-Sitemap
#Listenliste
#Startseite Startseite
#Unterseite Sekundärseite Unterseite
#Werkzeug, #Symbolleiste Symbolleiste
#drop drop-down
#dorpmenu drop-down-menü
#status status
#scroll scroll
.tab tab
.left .right .center Links, in der Mitte und rechts
.news News
.download Download
.banner Werbebanner (Top-Werbebanner)
Elektronikhandel bezogen
.products Produkte
.products_prices Produktpreise
.products_description Produktbeschreibung
.products_review Produktbewertung
.editor_review Editor-Bewertung
.news_release Neuestes Produkt
.publisher Hersteller
.screenshot Miniaturansicht
.faqs Häufig gestellte Fragen
.keyword keyword
.blog Blog
.forum Forum
CSS-Dateibenennungsbeschreibung
master.css, style.css main
module.css module
base.css Basic Sharing
layout.css Layout, Layout
themes.css-Theme
columns.css-Spalte
font.css-Text, Schriftart
forms.css-Formular
mend.css-Patch
print .css print
Andere Anweisungen für CSS Benennung:
DIV+CSS-Benennungszusammenfassung: Es spielt keine Rolle, ob Sie „.“ (Kleinbuchstaben) verwenden, um den Namen auszuwählen, der mit dem Symbol beginnt, oder „#“ (Nummernzeichen), um den Namen auszuwählen, der mit beginnt das Symbol , aber wir sollten besser darauf achten, dass die wichtigsten, speziellen, äußersten Felder mit dem Auswahlsymbol „#“ (Nummernzeichen) und die anderen mit dem „.“ (Kleinbuchstaben) beginnen. Auswahlsymbol. Erwägen Sie gleichzeitig die Benennung von CSS-Selektoren, um Aufrufe in HTML wiederzuverwenden.
Normalerweise sind unsere am häufigsten verwendeten Hauptnamen: wrap (Mantel, äußerste Schicht), header (Kopfzeile, Kopf), nav (Navigationsleiste), menu (Menü), title (Spaltentitel, im Allgemeinen mit dem Tag h1h2h3h4 verwendet) )
, Inhalt (Inhaltsbereich), Fußzeile (Fußzeile, unten), Logo (Logo, kann mit h1-Tag verwendet werden), Banner (Werbebanner, normalerweise oben), CopyRight (Urheberrecht). Andere können gezielt nach den eigenen Bedürfnissen eingesetzt werden.
DIVCSS5-Empfehlung: Die Haupt-, Wichtig- und äußersten Felder sollten mit dem Auswahlsymbol „#“ (Nummernzeichen) benannt werden, die anderen mit dem Auswahlsymbol „.“ (Kleinbuchstaben).
2. Die CSS-Stildateien heißen wie folgt:
Hauptmaster.css
Layout, layout.css
Spalten columns.css
Textschriftart.css
Druckstil print .css
themes.css
4. Englische Benennungskenntnisse: - TOP
Wenn Sie auf etwas stoßen, das nicht häufig verwendet wird, können Sie es mit einem Übersetzungstool übersetzen und ihm eine englische Sprache geben Name.
Es wird empfohlen, das Online-Übersetzungstool von Google zu verwenden:
Das obige ist der detaillierte Inhalt vonVollständige Liste der Div+CSS-Namenskonventionen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!