HTML命名规范

---

红色 * 代表强制，必须遵循！
看到一条分割线，即代表一个点结束

HTMLNameSpecification

• ID命名使用下划线命名法，如：hello_world

• Class命名使用骆驼命名法，如：helloWorld

• 样式文件命名规范

  全局的：global.css；
  主要的：master.css；
  布局、版面：layout.css；
  专栏：columns.css；
  文字：font.css；
  打印样式：print.css；
  主题：themes.css；
  补丁：pacth.css；
  格式化浏览器：base.css等。
  

• ID及Class命名常用名称

  页头：header
  登录条：login-bar
  标志：logo
  侧栏：side-bar
  广告：banner
  导航：nav
  子导航：sub-nav
  菜单：menu
  子菜单：sub-menu
  搜索：search
  搜索框： searchBox
  滚动：scroll
  页面主体：main
  内容：content
  标签页：tab
  文章列表：list
  提示信息：msg
  小技巧：tips
  栏目标题：title
  加入：joinus
  指南：guild
  服务：service
  热点：hot
  新闻：news
  下载：download
  注册：regsiter
  状态：status
  按钮：btn
  投票：vote
  合作伙伴：partner
  友情链接：friendlink
  版权：copyright
  外套：wrap
  页脚：footer
  标题：title
  顶导航：top-nav（mini-nav）
  转角/圆角： corner
  工具条： toolbar
  下拉： drop
  当前的： current
  简介：profiles
  

• 页面结构

  容器: container
  页头：header
  内容：content/container
  页面主体：main
  页尾：footer
  导航：nav
  侧栏：sidebar
  栏目：column
  左右中：left right center

• class命名

  • 颜色:使用颜色的名称或者16进制代码,如：
    • .red { color: red; }
    • .f60 { color: #f60; }
    • .ff8600 { color: #ff8600; }
  • 字体大小,直接使用"font+字体大小"作为名称,如：
    • .font12px { font-size: 12px; }
    • .font9pt {font-size: 9pt; }
  • 对齐样式,使用对齐目标的英文名称,如：
    • .left { float:left; }
    • .bottom { float:bottom; }
  • 标题栏样式,使用"类别+功能"的方式命名,如：
    • .barnews { }
    • .barproduct { }