星期二 上午阴，下午阴转小雨 5～11℃

一个相当好的励志视频

今天中午有位网友（localblog）发给我一个视频地址，看了之后觉得相当不错，相信看过的人也都一定能从视频中得到不小的收获。

感谢 localblog 分享：)

视频观看：《我和世界不一样》无手无脚无烦恼——力克·胡哲（难得中文字幕版）

CSS属性书写顺序及命名规则

网上关于css属性书写顺序的文章比较零散，流传的比较多的是“Mozilla的推荐”和“淘宝的规范”。

这一篇（CSS属性书写顺序及命名规则）总结得比较详细，主要提到的是 fantasai 和 Andy Ford 的 css 书写顺序，以及 css 命名规则，大体如下：

CSS属性书写顺序：

显示属性 -> 自身属性 -> 文本属性

1、影响文档流的属性（比如：display, position, float, clear, visibility, table-layout等）
2、自身盒模型的属性（比如：width, height, margin, padding, border等）
3、排版相关属性（比如：font, line-height, text-align, text-indent, vertical-align等等）
4、装饰性属性（比如：color, background, opacity, cursor等）
5、生成内容的属性（比如：content, list-style, quotes等）

例：

el {
 display: ;
 visibility: ;
 float: ;
 clear: ;

 position: ;
 top: ;
 right: ;
 bottom: ;
 left: ;
 z-index: ;

 width: ;
 min-width: ;
 max-width: ;
 height: ;
 min-height: ;
 max-height: ;
 overflow: ;

 margin: ;
 margin-top: ;
 margin-right: ;
 margin-bottom: ;
 margin-left: ;

 padding: ;
 padding-top: ;
 padding-right: ;
 padding-bottom: ;
 padding-left: ;

 border: ;
 border-top: ;
 border-right: ;
 border-bottom: ;
 border-left: ;

 border-width: ;
 border-top-width: ;
 border-right-width: ;
 border-bottom-width: ;
 border-left-width: ;

 border-style: ;
 border-top-style: ;
 border-right-style: ;
 border-bottom-style: ;
 border-left-style: ;

 border-color: ;
 border-top-color: ;
 border-right-color: ;
 border-bottom-color: ;
 border-left-color: ;

 outline: ;
 list-style: ;

 table-layout: ;
 caption-side: ;
 border-collapse: ;
 border-spacing: ;
 empty-cells: ;

 font: ;
 font-family: ;
 font-size: ;
 line-height: ;
 font-weight: ;
 text-align: ;
 text-indent: ;
 text-transform: ;
 text-decoration: ;
 letter-spacing: ;
 word-spacing: ;
 white-space: ;
 vertical-align: ;
 color: ;

 background: ;
 background-color: ;
 background-image: ;
 background-repeat: ;
 background-position: ;

 opacity: ;
 cursor: ;
 content: ;
 quotes: ;
}

CSS命名规则：

[ 模块前缀 ] _ 类型 _ ( 作用 | 状态 ) n _ [ 位置 n ]

图例说明：
　* ( 必选 )：必需存在
　* [ 可选 ]：可根据需要选择
　* |：多选一
　* n：可有多个

名词说明：

模块前缀
　模块定义时使用的前缀。

类型
　定义类的内容类型。如输入框、文本、段落等等。

作用
　定义类的作用，用于对类型的补充。

状态
　定义类的状态，用于对类型的补充。

位置
　定义类所使用的位置，如首页、导航等等，不排除使用左、右这样的词，但应尽量避免。

　* 每项都可有自己的一个缩写表，同一名称的缩写尽量统一。
　* 所选用的单词应选择不过于具体表示某一状态（如颜色、大小等）的单词，以避免当状态改变时名称失去意义。
　* 由不以数字开头的小写字母（a-z）、数字（0-9）组成。
　* 确保类(.class)的重用性与对象(#id)的唯一性，id避免使用保留字。

例：

模块前缀：

　* 弹出 pop
　* 公共 global,gb
　* 标题 title,tit
　* 提示 hint
　* 菜单 menu
　* 信息 info
　* 预览 pvw
　* Tips tips
　* 导航 nav

类型：

　* 按钮 bt
　* 文本 tx
　* 段落 p
　* 图标 icon
　* input input
　* 颜色 color,c
　* 背景 bg
　* 边框 bor

作用：

　* 设置 set
　* 添加 add
　* 删除 del
　* 操作 op
　* 密码 pw
　* 导入 inc

状态：

　* 成功 suc
　* 失败 lost
　* 透明 tran

位置：

　* 公共 gb
　* 边框 bor
　* 段落 p
　* 弹出 pop
　* 标题 title,tit
　* 菜单 menu
　* 内容 cont
　* 导航 nav

参考：http://kevinpeng.iteye.com/blog/677599

MeYoung

• 优化“货物跟踪”页面（by wy）；
• 解冻按钮做成全局（by wy）；
• 消费明细修改（by wy）；
• 其他修改。

友吧今天

• 参考上面的“CSS属性书写顺序”，再次优化css。现在只有首页的css，趁早优化一下，后面的页面都按这样的规范来写。
• 开始套场馆列表页。