HTML5學習_day10(2)--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
內容:content
標籤:tags
標籤頁:tab
文章列表:list
提示資訊:msg
小技巧:tips
欄目標題:title
加入:joinus
指南:guild
服務:service
註冊:regsiter
狀態:status
投票:vote
合作伙伴:partner
(二)css註釋的寫法:
/* Footer */ 內容區 /* End Footer */
Html註釋的寫法 :<!--header頭部-->
(三)id的命名:
(1)頁面結構
容器: container
頁頭:header
內容:content/container
頁面主體:main
頁尾:footer
導航:nav
側欄:sidebar
欄目:column
頁面外圍控制整體佈局寬度:wrapper
左右中:left right center
(2)導航
導航:nav
主導航:mainnav
子導航:subnav
頂導航:topnav
邊導航:sidebar
左導航:leftsidebar
右導航:rightsidebar
選單:menu
子選單:submenu
標題: title
摘要: summary
(3)功能
標誌:logo
廣告:banner
登陸:login
登入條:loginbar
註冊:register
搜尋:search
功能區:shop
標題:title
加入:joinus
狀態:status
按鈕:btn
滾動:scroll
標籤頁:tab
文章列表:list
提示資訊:msg
當前的: current
小技巧:tips
圖示: icon
註釋:note
指南:guild
服務:service
熱點:hot
新聞:news
下載:download
投票:vote
合作伙伴:partner
友情連結:link
版權:copyright
(四)class的命名:
(1)顏色:使用顏色的名稱或者16進位制程式碼,如
.red { color: red; } .f60 { color: #f60; } .ff8600 { color: #ff8600; }
(2)字型大小,直接使用’font+字型大小’作為名稱,如
.font12px { font-size: 12px; } .font9pt {font-size: 9pt; }
(3)對齊樣式,使用對齊目標的英文名稱,如
.left { float:left; } .bottom { float:bottom; }
(4)標題欄樣式,使用’類別+功能’的方式命名,如
.barnews { } .barproduct { }
注意事項::
1.一律小寫;
2.儘量用英文;
3.不加中槓和下劃線;
4.儘量不縮寫,除非一看就明白的單詞.
主要的 master.css 模組 module.css 基本共用 base.css 佈局,版面layout.css 主題 themes.css 專欄 columns.css 文字 font.css 表單 forms.css 補丁 mend.css 列印print.css