求css命名规范
求css命名规范
经常为怎么为个html容器进行css命名而头疼,请问大家有没有好的命名规范文档?
------解决方案--------------------http://www.zzsky.cn/build/content/1195.htm
http://bbs.blueidea.com/thread-2713058-1-1.html
------解决方案--------------------适合自己团队的命名,才是好的命名。
摘自网络,仅供参考。
1.样式命名
外 套:  wrap
主导航:  mainnav
子导航:  subnav
页 脚:  footer
整个页面: content
页 眉:  header
页 脚:  footer
商 标:  label
标 题:  title
主导航:  mainbav(globalnav)
顶导航:  topnav
边导航:  sidebar
左导航:  leftsidebar
右导航:  rightsidebar
旗 志:  logo
标 语:  banner
菜单内容1: menu1 content
菜单容量: menu container
子菜单:  submenu
边导航图标:sidebarIcon
注释:   note
面包屑:  breadcrumb(即页面所处位置导航提示)
容器:   container
内容:   content
搜索:   search
登陆:   Login
功能区:  shop(如购物车,收银台)
当前的   current
2.另外在编辑样式表时可用的注释可这样写:
<-- Footer -->
内容区
<-- End Footer -->
3.样式文件命名
主要的 master.css
布局,版面 layout.css
专栏 columns.css
文字 font.css
打印样式 print.css
主题 themes.css  
由于项目中编写文档结构、编写CSS的人员较多,并与程序员协同工作,就需要统一class与id的名称,前天花了一点时间,按照大多人的习惯,制定了下面的常用关键字:
容    器:container/box  
头    部:header  
主 导 航:mainNav  
子 导 航:subNav  
顶 导 航:topNav  
网站标志:logo  
大 广 告:banner  
页面中部:mainBody  
底    部:footer  
菜    单:menu  
菜单内容:menuContent  
子 菜 单:subMenu  
子菜单内容:subMenuContent  
搜    索:search  
搜索关键字:keyword  
搜索范围:range  
标签文字:tagTitle  
标签内容:tagContent  
当前标签:tagCurrent/currentTag  
标   题:title  
内    容:content  
列    表:list  
当前位置:currentPath  
侧 边 栏:sidebar  
图    标:icon  
注    释:note  
登    录:login  
注    册:register  
列 定 义:column_1of3 (三列中的第一列)
------解决方案--------------------(一)常用的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
 标签页:tab
 文章列表:list
 提示信息:msg
 小技巧:tips
 栏目标题:title
 加入:joinus
 指南:guild
 服务:service
 注册:regsiter
 状态:status
 投票:vote
 合作伙伴:partner  
(二)注释的写法:
 /* Footer */
 内容区
 /* End Footer */  
(三)id的命名:
 (1)页面结构
 容器: container
 页头:header
 内容:content/container
 页面主体:main
 页尾:footer
 导航:nav
 侧栏:sidebar
 栏目:column
 页面外围控制整体布局宽度:wrapper
 左右中:left right center
 (2)导航
 导航:nav
 主导航:mainbav
 子导航:subnav
 顶导航:topnav
 边导航:sidebar
 左导航:leftsidebar
 右导航:rightsidebar
 菜单:menu
 子菜单:submenu
 标题: title
 摘要: summary
 (3)功能
 标志:logo
 广告:banner
 登陆:login
 登录条:loginbar
 注册:regsiter
 搜索: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; }