css命名规范
页面结构命名
1. page:代表整个页面,用于最外层。
2. wrap:外套,将所有元素包在一起的一个外围包,用于最外层
3. wrapper:页面外围控制整体布局宽度,用于最外层
4. container:一个整体容器,用于最外层
5. head、header:页头区域,用于头部
6. nav:导航条
7. content:内容,网站中最重要的内容区域,用于网页中部主体
8. main:网站中的主要区域(表示最重要的一块位置),用于中部主体内容
9. column:栏目
10. sidebar:侧栏
11. foot、footer:页尾、页脚。网站一些附加信息放置区域,(或命名为copyright)用于底部
导航命名
1. nav、navbar、navigation、nav-wrapper:导航条或导航包,代表横向导航
2. topnav:顶部导航
3. mainbav:主导航
4. subnav:子导航
5. sidebar:边导航
6. leftsidebar 或 sidebar_a :左导航
7. rightsidebar 或 sidebar_b:右导航
8. title:标题
9. summary:摘要/li>
10. menu:菜单。区域包含一般的链接和菜单
11. submenu:子菜单
12. drop:下拉
13. dorpmenu:下拉菜单
14. links:链接菜单
功能命名
1. logo:标记网站logo标志
2. banner:标语、广告条、顶部广告条
3. login:登陆,(例如登录表单:form-login)
4. loginbar:登录条
5. regsiter:注册
6. tool、toolbar:工具条
7. search:搜索
8. searchbar:搜索条
9. searchlnput:搜索输入框
10. shop:功能区,表示现在的
11. icon:小图标
12. label:商标
13. homepage:首页
14. subpage:二级页面子页面
15. hot:热门热点
16. list:文章列表,(例如新闻列表:list-news)
17. scroll:滚动
18. tab:标签
19. sitemap:网站地图
20. msg 或 message:提示信息
21. current:当前的
22. joinus:加入
23. status:状态
24. btn:按钮,(例如搜索按钮可写成:btn-search)
25. tips:小技巧
26. note:注释
27. guild:指南
28. arr、arrow:标记箭头
29. service:服务
30. breadcrumb:(即页面所处位置导航提示)
31. download:下载
32. vote:投票
33. siteinfo:网站信息
34. partner:合作伙伴
35. link、friendlink:友情链接
36. copyright:版权信息
37. siteinfoCredits:信誉
38. siteinfoLegal:法律信息
CSS样式命名
1. 页面线条命名:line_x (横线)、line_y (纵线)或 line_red(红线)、line_black(黑线)
2. 图片图标命名:pic_1.jpg、pic_2.jpg 或 ico_1.gif、ico_2.gif
3. 页面广告命名:ad_01、ad_02
4. 背景框架命名:nav_bg(代表导航条的背景图片位置)、tool_bg(代表工具栏的背景图片位置)
CSS样式表命名
1. index.css:单独为首页建立样式
2. head.css:头部样式,多个页面头部设计风格相同时使用。
3. base.css:共用样式。
4. style.css:独立页面所使用的样式文件。
5. global.css:页面样式基础,全局公用样式,页面中必须包含。
6. layout.css:布局、版面样式,公用类型较多时使用,一般用在首页级页面和产品类页面中
7. module.css:模块,用于产品类页,也可与其它样式配合使用。
8. master.css:主要的样式表
9. columns.css:专栏样式
10. themes.css:主体样式
11. forms.css:表单样式
12. mend.css:补丁,基于以上样式进行的私有化修补。