div+css命名规范

《div+css命名规范》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、DIV+CSS规范命名大全集合页头：header如：#header{属性:属性值;}或.header{属性:属性值;},也许你需要了解class与id区别及用法登录条：loginBar标志：logo侧栏：sideBar广告：banner导航：nav子导航：subNav菜单：menu子菜单：subMenu搜索：search滚动：scroll页面主体：main内容：content标签页：tab文章列表：list提示信息：msg小技巧：tips栏目标题：title加入：joinus指南：guild服务：service热点：hot新闻：news下载：download注册：r

2、egsiter状态：status按钮：btn投票：vote合作伙伴：partner友情链接：friendLink页脚：footer版权：copyRight常用配合标签div、h1、h2、h3、h4、span、em、b、strong、font、u1.CSS的ID的命名也许你需要了解class与Id区别外　套：wrap主导航：mainNav子导航：subnav页　脚：footer整个页面：content页　眉：header版权：copyRight商　标：label标　题：title主导航：mainNav(globalNav)顶导航：topnav边导航：sidebar左导

3、航：leftsideBar右导航：rightsideBar旗　志：logo标　语：banner菜单内容1：menu1Content菜单容量：　menuContainer子菜单：　　submenu边导航图标：sidebarIcon注释：　　　note面包屑：breadCrumb(即页面所处位置导航提示)容器：container内容：content搜索：search登陆：login功能区：　　shop(如购物车，收银台)当前：currentDIV+CSS命名小结：无论是使用“.”（小写句号）选择符号开头命名，还是使用“#”(井号)选择符号开头命名都无所谓，但我们最好遵循

4、，主要的、重要的、特殊的、最外层的盒子用“#”(井号)选择符号开头命名，其它都用“.”（小写句号）选择符号开头命名，同时考虑命名的CSS选择器在HTML中重复使用调用。通常我们最常用主要命名有：wrap（外套、最外层）、header（页眉、头部）、nav(导航条)、menu(菜单)、title(栏目标题、一般配合h1h2h3h4标签使用)、content(内容区)、footer(页脚、底部)、logo（标志、可以配合h1标签使用）、banner（广告条，一般在顶部）、copyRight（版权）。其它可根据自己需要选择性使用。DIVCSS5建议：主要的、重要的、

5、最外层的盒子用“#”(井号)选择符号开头命名，其它都用“.”（小写句号）选择符号开头命名。css文件命名1)如果是一个小型网站或一个企业网站，只要一个css文件,一般取名为:style.css/main.css/layout.css2)如果是个大型的门户网站，css一般分三个文件区分出来,用的最常用的css和公共部分的css放在common.css;一些主要的其他css放在content.css;字体放在font.css　　主要的:master.css　　专栏:columns.css　　主题:themes.css　　全局样式：global.css；　　框架布局：la

6、yout.css；　　字体样式：font.css；　　链接样式：link.css；　　打印样式：print.css；模块module.css基本共用base.css表单forms.css补丁mend.cssCSS命名规则(1)页面结构首页:homepage二级页面:subpage　标签页:tab博客:bolg论坛:forum/bbs外套：wrapper容器：container/box内容：content页面头部：header页面主体:main　页面中部：mainBody　页面底部：footer侧栏：sidebar栏目：column左右中：leftrightcente

7、r(2)导航导航:nav　　主导航：mainnav/globalnav　　子导航：subnav　　顶导航：topnav(3)侧栏　　侧边栏：sidebar　　左侧栏：leftsidebar　　右侧栏：rightsidebar左右两栏sidebar_l/sidebar_r或者leftsidebar/rightsidebar左/中/右三栏main_left/main_mid/main_right或者main_l/main_m/mian_r(4)菜单　　菜单：menu　　菜单内容：menucontent　　子菜单：subMenu　　子菜单内容：subMenuConte