一、css 命名

1.0 目录结构

1.1 文件（平台+类型）

PC端：web_ PC大厅：cl_ TV端：tv_ 移动端：mob_

1.公共型样式：标签的重置和设置默认值、网站通用布局、通用模块和其扩展、功能类样式

<link href="/css/web_global.css" rel="stylesheet" type="text/css"/>------PC端
<link href="/css/cl_global.css" rel="stylesheet" type="text/css"/>------PC大厅端
<link href="/css/tv_global.css" rel="stylesheet" type="text/css"/>------TV端
<link href="/css/mob_global.css" rel="stylesheet" type="text/css"/>------手机端

2.特殊型样式：页面的样式维护率较高、模块的独立样式

<link href="assets/css/web_index.css" rel="stylesheet" type="text/css"/>
<link href="assets/css/cl_index.css" rel="stylesheet" type="text/css"/>
<link href="assets/css/tv_index.css" rel="stylesheet" type="text/css"/>
<link href="assets/css/mob_index.css" rel="stylesheet" type="text/css"/>

3.皮肤型样式：将颜色、背景等抽离出来放在这里

<link href="assets/css/web_skin.css" rel="stylesheet" type="text/css"/>
<link href="assets/css/cl_skin.css" rel="stylesheet" type="text/css"/>
<link href="assets/css/tv_skin.css" rel="stylesheet" type="text/css"/>
<link href="assets/css/mob_skin.css" rel="stylesheet" type="text/css"/>

1.2 分类

g_ 布局(grid) 页面分割的几个大块 如页面头部、主体、主栏、侧栏、尾部

.g_sd{float:left;width:300px;}

m_ 模块(module) 可组合的功能完善的整体 如页面中一个独立的布局。

.m_cms{width:200px;height:50px;}

c_ 组件(component) 业务模块抽象出来的可配置功能 如弹窗、滑竿、转盘等的默认样式

.c_layer{width:100%;height:100%;}

u_ 元件(unit) 不可再分的较为小的个体 如按钮、输入框

.u_btn{height:20px;border:1px solid #333;}

f_ 功能(function) 选择器具有固定样式表现 如清除浮动等！

.f_tac{text-align:center;}

s_ 皮肤(skin) 把皮肤型的样式抽离出来 如文字色、背景色（图）、边框色

.s_fc,a.s_fc:hover{color:#fff;}

z_ 状态(skin) 如显示 选中 出错

1.3 语义化简写