html與css命名規範小結

2022-09-08 18:51:14 字數 1080 閱讀 6328

一、命名規則說明

所有的命名最好都用小寫

使用英文命名

給每乙個**和表單加上乙個唯一的、結構標記id

給每個加上alt標籤,優點在於發生錯誤時,alt可以體現給使用者

二、相對網頁外層重要部分css樣式命名

wrap——用於最外層

header——用於頭部

main——用於主題內容(中部)

main-left——左側布局

main-right——右側布局

n**——網頁選單導航條

content——用於網頁中部主體

footer——用於底部

css命名其他說明

三、類class的書寫規範示例

字型大小,直接使用"font+字型大小"作為名稱,如:

標題欄樣式,使用"類別+功能"的方式命名,如:

省略0後邊的單位,如:

四、標籤屬性命名規範

id:—— 連線符命名法「hello-world」

class:—— 連線符命名法「hello-world」

name:—— 駱駝式命名法「helloworld」

五、注意事項

h1~h6:文章標題、內容區塊標題,根據重要性由大到小區分,h1乙個頁面只出現一次

文字框不使用size屬性定義寬度,而使用css的width屬性

新增maxlength屬性限制輸入字元的長度

把id留給後台開發和js使用,除此之外頁面的page id(如首頁的外層需要乙個id id=」page_index」),頁面結構(header main footer)允許用id命名之外,其他禁止id使用在樣式表css命名中,一律使用class命名

為了節省位元組數以及檔案大小,盡量使用屬性的簡寫方式

如果顏色使用16進製制色值,當6個數字兩兩相等時,使用縮寫方式編寫,比如:#996600縮寫為#960

六、命名

背景:bg001,bg002……

一般:img001,img002……

特定:如icon,logo按照具體情況命名

按鈕:btn-submit,btn-cancel……

html命名規範

default index.html 首頁 404.html 404錯誤頁 print.html 列印頁 header.html 頁頭 footer.html 頁尾 passport.html 通行證 rank.html 排行榜 roll.html 滾動新聞 solution.html 解決方案 j...

css命名規範

良好的命名規範可以為團隊合作開發推波助瀾,無論在專案開發,還是產品維護上都起到了至關重要的作用。應該說命名規範是一種約定,也是程式設計師之間良好溝通的橋梁。命名規則 2.樣式檔案命名 主要的 master.css 布局版面 layout.css 專欄 columns.css 文字 font.css ...

CSS命名規範

網上整理的比較好的css命名規則,為css 的規範化做參考,增加 的可讀性。id的命名 1 頁面結構 2 導航 1.不使用大寫形式的類名和id名 2.盡可能使用描述性的英文單詞的組合作為類名和id名 3.id名及類名的多個英文單詞之間使用 短橫線分隔 4.按區域進行描述編號 例 main01 div...