CSS書寫順序
? ? ? ? ? ? ? ? ? ? 1.位置屬性(position, top, right, z-index, display, float等)
? ? ? ? ? ? ? ? ? ? 2.大小(width, height, padding, margin)
? ? ? ? ? ? ? ? ? ? 3.文字系列(font, line-height, letter-spacing, color- text-align等)
? ? ? ? ? ? ? ? ? ? 4.背景(background, border等)
? ? ? ? ? ? ? ? ? ? 5.其他(animation, transition等)
CSS書寫規(guī)范
使用CSS縮寫形式
CSS有些屬性是可以縮寫的赂蕴，比如padding,margin,font等等，這樣精簡代碼同時又能提高用戶的閱讀體驗舶胀。
去掉小數(shù)點前的“0”
簡寫命名
連字符CSS選擇器命名規(guī)范
????????????????????1.長名稱或詞組可以使用中橫線來為選擇器命名概说。
????????????????????2.不建議使用“_”下劃線來命名CSS選擇器碧注，為什么呢？
? ? ? ? ? ? ? ? ? ? ? ? ? ? |? ? ?輸入的時候少按一個shift鍵席怪；
? ? ? ? ? ? ? ? ? ? ? ? ? ? ||? ? 瀏覽器兼容問題 （比如使用_tips的選擇器命名应闯，在IE6是無效的）
? ? ? ? ? ? ? ? ? ? ? ? ? ? |||? ?能良好區(qū)分JavaScript變量命名（JS變量命名是用“_”）
不要隨意使用Id
id在JS是唯一的，不能多次使用挂捻，而使用class類選擇器卻可以重復(fù)使用碉纺，另外id的優(yōu)先級優(yōu)先與class，所以id應(yīng)該按需使用刻撒，而不能濫用骨田。
CSS命名規(guī)范（規(guī)則）
常用的CSS命名規(guī)則
????頭：header
????內(nèi)容：content/container
????尾：footer
????導(dǎo)航：nav????
????側(cè)欄：sidebar
????欄目：column
????頁面外圍控制整體佈局寬度：wrapper
????左右中：left right center
????登錄條：loginbar
????標志：logo
????廣告：banner
????頁面主體：main????
????熱點：hot
????新聞：news
????下載：download
????子導(dǎo)航：subnav
????菜單：menu
????子菜單：submenu
????搜索：search
????友情鏈接：friendlink
????頁腳：footer
????版權(quán)：copyright????
????滾動：scroll
????內(nèi)容：content
????標簽：tags
????文章列表：list
????提示信息：msg
????小技巧：tips
????欄目標題：title
????加入：joinus
????指南：guide
????服務(wù)：service
????注冊：regsiter
????狀態(tài)：status
????投票：vote
????合作伙伴：partner
注釋的寫法:
????/* Header */
????內(nèi)容區(qū)
????/* End Header */
ID的命名
（1）頁面結(jié)構(gòu)
? ??????容器: container
????????頁頭：header
????????內(nèi)容：content/container
????????頁面主體：main
????????頁尾：footer
????????導(dǎo)航：nav
????????側(cè)欄：sidebar
????????欄目：column
????????頁面外圍控制整體佈局寬度：wrapper
????????左右中：left right center
（2）導(dǎo)航
? ??????導(dǎo)航：nav
????????主導(dǎo)航：mainnav
????????子導(dǎo)航：subnav
????????頂導(dǎo)航：topnav
????????邊導(dǎo)航：sidebar
????????左導(dǎo)航：leftsidebar
????????右導(dǎo)航：rightsidebar
????????菜單：menu
????????子菜單：submenu
????????標題: title
????????摘要: summary
（3）功能
? ? ? ? 標志：logo
????????廣告：banner
????????登陸：login
????????登錄條：loginbar
????????注冊：register
????????搜索：search????????
????????功能區(qū)：shop
????????標題：title
????????加入：joinus
????????狀態(tài)：status
????????按鈕：btn
????????滾動：scroll
????????標籤頁：tab
????????文章列表：list
????????提示信息：msg
????????當(dāng)前的: current
????????小技巧：tips
????????圖標: icon
????????注釋：note
????????指南：guild
????????服務(wù)：service
????????熱點：hot????
????????新聞：news
????????下載：download
????????投票：vote
????????合作伙伴：partner
????????友情鏈接：link
????????版權(quán)：copyright
注意事項??
????????1.一律小寫;
????????2.盡量用英文;
????????3.不加中槓和下劃線;
????????4.盡量不縮寫，除非一看就明白的單詞????????
CSS樣式表文件命名
????????主要的 master.css
????????模塊 module.css
????????基本共用 base.css
????????布局声怔、版面 layout.css
????????主題 themes.css
????????專欄 columns.css
????????文字 font.css
????????表單 forms.css
????????補丁 mend.css
????????打印 print.css
