雞西網站建設制作優化設計[SEO]
本頁定位
在線咨詢

分享HTML和CSS的規范命名

假裝紳士??1年前 (2018-09-04)1244A+A-

雞西網近期將會在保留現有CSS內容的情況下,增加一些新的CSS內容。因雞西網還有很多頁面沒有添加,其中包括業務范圍的網站設計、網站建設、域名注冊等等。需要有大量的CSS來支持。

在這段時間與HTML5和CSS3的接觸中學到了很多以前沒有經歷過的內容,在測試某些CSS樣式時,總是會遇到如何命名的問題,搞的很是不夠規范。就想著找到個關于HTML和CSS比較規范又比較易懂、通用的命名的寫法。如果以后所有網站都能遵循這種寫法,相信在對百度收錄上也會有很大的提高,自己看著也順眼了,一目了然。推薦廣告網站制作者和站長們使用這種規范命名方法,具體命名方法如下。

HTML標簽命名

頁頭:header如:div#header{屬性:屬性值;}或div.header{屬性:屬性值;}
登錄條:loginBar、標志:logo、側欄:sideBar、廣告:banner、導航:nav、子導航:subNav、菜單:menu、子菜單:subMenu、搜索:search、滾動:scroll、頁面主體:main、內容:content、標簽頁:tab、文章列表:list、提示信息:msg、小技巧:tips、欄目標題:title、加入:joinus、指南:guild、服務:service、熱點:hot、新聞:news、下載:download、注冊:regsiter、狀態:status、按鈕:btn、投票:vote、合作伙伴:partner、友情鏈接:friendLink、頁腳:footer、版權:copyRight

常用配合標簽:divh1h2h3h4spanembstrongfontu

CSS標簽命名

外 套:wrap、主導航:mainNav、子導航:subnav、頁 腳:footer、整個頁面:content、頁 眉:header、版 權:copyRight、商 標:label、標 題:title、主導航:mainNav(globalNav)、頂導航:topnav、邊導航:sidebar、左導航:leftsideBar、右導航:rightsideBar、旗 志:logo 標 語:banner、菜單內容1:menu1Content、菜單容量:menuContainer、子菜單:submenu、邊導航圖標:sidebarIcon、注釋:note、面包屑:breadCrumb(即頁面所處位置導航提示)、容器:container、內容:content、搜索:search、登陸:login、功能區:shop(如購物車,收銀臺)、當前:current

HTML+CSS命名小結:無論是使用“.”(小寫句號)選擇符號開頭命名,還是使用“#”(井號)選擇符號開頭命名都無所謂,但我們最好遵循,主要的、重要的、特殊的、最外層的盒子用“#”(井號)選擇符號開頭命名,其它都用“.”(小寫句號)選擇符號開頭命名,同時考慮命名的CSS選擇器在HTML中重復使用調用。
雞西網在日后建站中最常用的主要命名有:wrap(外套、最外層)、header(頁眉、頭部)、nav(導航條)、menu(菜單)、title(欄目標題、一般配合h1\h2\h3\h4標簽使用)、content (內容區)、footer(頁腳、底部)、logo(標志、可以配合h1標簽使用)、banner(廣告條,一般在頂部)、copyRight(版權)。其它大可根據自己需要選擇性使用。

CSS樣式表文件命名

主要樣式 master.css或style.css
布局樣式 layout.css
專欄樣式 columns.css
文字樣式 font.css
打印樣式 print.css
主題樣式 themes.css

其實在大多情況下,基本都只用一個style.css文件就夠了。除非有特別需要區分文件的時候,例如在不同設備或者不同樣式選擇上,多分類的CSS文件會更便于切換一些。

好了,以上就是雞西網整理的關于HTML+CSS的規范命名的方法,感謝大家對雞西網的支持。

全部評論: 0
登錄沒有賬號 切換注冊

忘記密碼 ?

注冊已有賬號 切換登錄

15选5走势图开奖