想着最近做的微信公众号，维护起来那class，简直惨不忍睹，应该很难找到吧，今天准备花心血进行一番大改动 不知道会持续多久，哎，想想就头疼。在领导的推荐下，准备参照网易云的规范，好好对命名进行规范一下，参照的具体地址http://nec.netease.com/standard/css-sort.html；
一，大的类别区分
公共型样式（通用布局，通用组件和扩展）；
特殊型样式（与整体差异性较大的时候，设置的单独样式）；
皮肤型样式（这里感觉用处不大，也没那个必要再去引入一个文件）；
因此我选择上述2个区分样式作为自己的css库来分类；一会还得找找最新的消除浏览器差异的样式文件o(╥﹏╥)o；
二，命名规范
在上述公共型样式中 选择以html文件名字开头大写字母（区分不同的名字差异）并使用连字符连接，在参考了他们的命名规则以后，我自己选择以以下方式命名（大小写无区别）
.si-headder-nav-div.class-xxx
采取的是定位的方式 例如在single.html和segment.html 选择定位sihtml文件，然后选择header部位然后定位到header里面 calss为nav的元素下面 继续定位到nav下面的div元素 class为xxx的元素
#常用命名规则
头：header
内容：content/container
尾：footer
导航：nav
侧栏：sidebar
栏目：column
页面外围控制整体佈局宽度：wrapper
左右中：left right center
登录条：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
三，书写顺序
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等)
一会儿要开始痛苦的挣扎了，心好痛。不知道会不会
网友评论