css样式表的命名

作者:孙莎莎
日期:2012/5/30 9:58:07

 

     div+css样式表的id和class的区别:就一句来概括,class可以定义多个值并且可以应用到多个标签上,但id只能是一个。

   首先讲一下div+css样式表的id的常用命名规则   

   页头:header 登录条:loginBar 标志:logo 侧栏:sideBar 广告:banner导航:nav 子导航:subNav菜单:menu 子菜单:subMenu搜索:search滚动:scroll页面主体:main内容:content标签页:tab 文章列表:list提示信息:msg小技巧:tips栏目标题:title加入:joinus指南:guild服务:service热点:hot新闻:news下载:download注册:regsiter状态:status按钮:btn投票:vote合作伙伴:partner友情链接:friendLink页脚:footer版权:copyRight   

     实际上上面的div+css样式表的id命名也会经常用大小写和_来区分,比如主导航就是MainNav,如果还有必要在区分就是MainNav_1,MainNav_2等等。也可以使用"类型+变量名称"的规则来命名,比如写一个红色字体的class,可以.f_red {}(f是font 字体的缩写)。总之原则是:大小写、_、缩写,大大增强代码的可读性。   

     再讲一下div+css样式表的class的常用命名规则   

     外套:wrap 主导航:mainNav 子导航:subnav 页 脚:footer整个页面:content页 眉:header 页 脚:footer 商 标:label 标 题:title 主导航:mainNav(globalNav)边导航:sidebar 左导航:leftsideBar 右导航:rightsideBar 旗 志:logo 标 语:banner菜单内容:menu1Content 菜单容量:menuContainer 子菜单:submenu 边导航图标:sidebarIcon 注释:note 面包屑:breadCrumb(即页面所处位置导航提示) 容器:container内容:content搜索:search 登陆:login 功能区:shop(如购物车,收银台) 当前的:current

分享