css - 命名規範
css文件分類
1、公共型:標簽重置、默認設置、通用樣式
2、特殊型:特殊布局、特殊模塊、特殊皮膚
css文件引用順序
1、公共
2、主體
3、皮膚及其他模塊
常用文件名
master.css or index.css or main.css 主要的
module.css 模塊
base.css or global.css 基本公用
layout.css 布局
themes.css 主題
skin.css 換膚
column.css 欄目
font.css 文本、字體
forms.css 表單
mend.css 補丁
print.css 打印
css內部引用順序
1、樣式重置和主體樣式
2、統一的背景和字體、功能型樣式clearfix
3、布局(grid) (.g-):頭部、主體、主欄、側欄、尾部等
4、模塊(module) (.m-):導航、登錄、註冊、列表、評論、搜索
5、元件(unit) (.u-):按鈕、輸入框、圖標
6、功能(function) (.f-):特殊用途css,如隱藏元素
7、皮膚(skin) (.s-):文字顏色、背景、邊框
8、狀態(.z-):只能組合使用或作為後代元素
css命名規範
1、所有命名全部小寫且用英文命名
2、顏色值和字符集大寫
2、分類命名,如:.g-
3、使用縮寫,如:nav、btn
4、使用class命名,確定不復用的樣式用id命名
5、使用語義的命名,不使用單個字母命名
6、使用-或者_連接命名,如:header-banner、header_banner
常用命名
布局(.g-)
文檔 document doc
頭部 head hd
主體 body bd
尾部 foot ft
主欄 main mn
主欄容器 maincontains mnc
側欄 side sd
側欄容器 sidecontains sdc
盒容器 wrap wp
模塊(.m-)、元件(.u-)
導航 navigator nav
子導航 subnavigator snav
面包屑 crumb crm
菜單 menu
選項卡 tab
標題區 head/title hd/tt
內容區 body/content bd/ct
列表 list
表格 table tb
表單 form fm
熱點 hot
排行 top
登錄 login
標誌 logo
廣告 banner
搜索 search
幻燈 slide
提示 tips
幫助 help
新聞 news
下載 download
註冊 register
投票 vote
版權 copyright
結果 result
標題 title
按鈕 button btn
輸入 input ipt
功能(.f-)
浮動清除 clearfix cf
向左浮動 floatleft fl
向右浮動 floatright fr
內聯塊級 inlineblock ib
文本居中 textaligncenter tac
文本居右 textalignright tar
文本居左 textalignleft tal
垂直居中 verticalalignmiddle vam
溢出隱藏 overflowhidden oh
完全消失 displaynone dn
字體大小 fontsize fs
字體粗細 fontweight fw
皮膚(.s-)
字體顏色 fontcolor fc
背景 background bg
背景顏色 backgroundcolor bgc
背景圖片 backgroundimage bgi
背景定位 backgroundposition bgp
邊框顏色 bordercolor bdc
狀態(.z-)
選中 selected sel
當前 current crt
顯示 show
隱藏 hide
打開 open
關閉 close
出錯 error err
不可用 disabled dis
css - 命名規範