文档介绍：CSS 规范命名大全集合 dadaV20160303 常用名称常用名称头: header 内容: content/container 尾: footer 导航: nav 侧栏: sidebar 栏目: column 页面外围控制整体布局宽度: wrapper 左右中: leftrightcenter 登录条: loginbar 标志: logo 广告: banner 页面主体: main 热点: hot 新闻: news 下载: download 子导航: subnav 菜单: menu 子菜单: submenu 搜索: search 友情链接: friendlink 页脚: footer 版权: copyright 滚动: scroll 内容: content 标签: tags 文章列表: list 提示信息: msg 小技巧: tips 栏目标题: title 加入: joinus 指南: guide 服务: service 注册: regsiter 状态: status 投票: vote 合作伙伴: partner 注释的写法:/*Header*/ 内容区/*EndHeader*/ id的命名:1)页面结构容器:container 页头: header 内容: content/container 页面主体: main 页尾: footer 导航: nav 侧栏: sidebar 栏目: column 页面外围控制整体佈局宽度: wrapper 左右中: leftrightcenter (2) 导航导航: nav 主导航: mainnav 子导航: subnav 顶导航: topnav 边导航: sidebar 左导航: leftsidebar 右导航: rightsidebar 菜单: menu 子菜单: submenu 标题:title 摘要:summary (3) 功能标志: logo 广告: banner 登陆: login 登录条: loginbar 注册: register 搜索: search 功能区: shop 标题: title 加入: joinus 状态: status 按钮: btn 滚动: scroll 标签页: tab 文章列表: list class 的命名(1) 颜色:使用颜色的名称或者 16进制代码,如: .red{color:red;} .f60{color:#f60;} .ff8600{color:#ff8600;} (2) 字体大小,直接使用"font+ 字体大小"作为名称,如: .font12px{font-size:12px;} .font9pt{font-size:9pt;} (3) 对齐样式,使用对齐目标的英文名称,如: .left{float:left;} .bottom{float:bottom;} (4) 标题栏样式,使用"类别+功能"的方式命名, 如: .barnews{} .barproduct{} 提示信息: msg 当前的:current 小技巧: tips 图标:icon 注释: note 指南: guild 服务: service 热点: hot 新闻: news 下载: download 投票: vote 合作伙伴: partner 友情链接: link 版权: copyright 目录: dir CSS 规则一、 CSS 书写顺序 1. 位置属性(position,top,right,z-index,display,float 等) 2. 大小(width,height,padding,margin) 3. 文字系列(font,line-height,letter-spacing,color-text-align 等) 4. 背景(background,border 等) 5. 其他(animation,transition 等) 二、 CSS 书写规范 1. 使用 CSS 缩写属性 CSS 有些属性是可以缩写的,比如 padding,margin,font 等等,这样精简代码同时又能提高用户的阅读体验。 2. 去掉小数点前的“0” 3. 简写命名很多用户都喜欢简写类名,但前提是要让人看懂你的命名才能简写哦! 进制颜色代码缩写有些颜色代码是可以缩写的,我们就尽量缩写吧,提高用户体验为主。 5 连字符 CSS 选择器命名规范 1). 长名称或词组可以使用中横线来为选择器命名。 2). 不建议使用“_”下划线来命名 CSS 选择器,为什么呢? 输入的时候少按一个 shift 键;浏览器兼容问题(比如使用_tips 的选择器命名,在 IE6 是无效的)能良好区分 JavaScript 变量命名( JS 变量命名是用“_”) 6. 不要随意使用 id i