要想成為前端大神，那些你不得不知曉的web前端命名規範。
阿新 • • 發佈：2018-10-28
let 優勢 是我 wke gre com 下載 sans 寬度
一、Web語義化
1.1 H5的語義化
對於經驗資深的前端er，在給web布局時，相信都會很註重標簽和命名的規範。尤其是隨著html5的普及發展，更是把web前端語義化推向一個新的臺階上。比如html5給我們新增的語義標簽：header、nav、main、aside、footer、section、article等等。那麽對於web語義化，有什麽優勢呢？
1.2 語義化優勢
可以讓人一目了然代碼結構塊，對於項目的維護或者優化都是非常有意義的。
語義化能提高頁面SEO。如：
<header></header>可以很好的代替傳統的<div id="header"></div>。
1.3 語義化使用規則
- 標簽語義化，如在合適的地方用合適的語義化標簽，如頭部可用
<header>、尾部可用<footer>； - 命名語義化，包括html的id和class的命名，javascript相關命名；如#header{}、.footer{}、等。
二、命名規範
2.1 常見的命名參考規範
在開發的時候,經常會因為元素命名而頭疼，無論是CSS樣式命名還是現在很經常接觸到的自定義組件命名. 下面整理一些常用的命名參考規範:
頭部：header
內容：content/container
尾部：footer
導航：nav
側欄：sidebar
欄目：column
整體布局：wrapper
左右中：left / right / center
登錄條：loginbar
標誌：logo
廣告：banner
頁面主體：main
熱點：hot
新聞：news
下載：download
子導航：subnav
菜單：menu
子菜單：submenu
搜索：search
友情鏈接：friendlink
頁腳：footer
版權：copyright
滾動：scroll