首頁 > web前端 > html教學 > html命名規範的詳細介紹

html命名規範的詳細介紹

零下一度
發布: 2017-07-26 11:17:33
原創
2138 人瀏覽過

前面的話

  由歷史原因及個人習慣引起的 DOM 結構、命名不統一,導致不同成員在維護同一頁時,效率低下,迭代、維護成本極高。所以,使用統一的命名規範非常必要。本文將詳細介紹命名規範

 

目錄命名

  1、專案資料夾:projectname

  2、樣式資料夾:css

  3、腳本資料夾:js

  4、樣式類別圖片資料夾:img

 

圖片命名

#  圖片命名建議以下列順序命名:

  (m_)圖片功能類別(必選)+ 圖片模組名稱(可選) + 圖片精度(可選)

  m_表示是否公共,可選

【圖片功能類別】

  icon:模組類別固化的圖示

#  logo:LOGO類別

  spr:單一頁面各種元素合併集合

  btn:按鈕

  bg:可平鋪或大背景

  pic :表示目前內容或業務的圖片

#【圖片模組名稱】

  goodslist:商品列表

  goodsinfo:商品信息

  userportrait:用戶頭像

【圖片精度】

  普清:@1x

  Retina:@2x | @3x

//公共模块:
m_btn_goodlist@2x.png
m_btn_goodlist.png

//非公共模块:
wx_btn_goodlist@2x.png
wx_btn_goodlist.png
btn_goodlist.png
登入後複製

檔案命名

  確保檔案命名總是以字母開頭而不是數字,且字母一律小寫,以下劃線連接且不帶其他標點符號,如

<!-- HTML -->
connect.html
connect_list.html
connect_detail.html
<!-- SASS -->
connect.scss
connect_list.scss
connect_detail.scss
登入後複製

以上是html命名規範的詳細介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板