前端样式书写规范

一、善用css缩写规则

1. 边距（4边）：

1px 2px 3px 4px (上、右、下、左)

1px 2px 3px（省略  左等于右）

1px 2px (省略  上等于下)

1px（四边都相同）

2. 缩写（border）特定样式：

border:1px solid #ffffff;/*粗细   样式   颜色*/
border-width:0 1px 2px 3px;/*上、右、下、左*/

3. 关于文字的缩写规则：

font-style:italic; /*斜体形式*/
font-variant:small-caps/normal; /*变体样式：小型大写字母/正常*/
font-weight:bold;/*粗体*/
font-size:12px;/*字体大小*/
line-height:1.2em(120%)/1.5em(150%);/*行高*/
font-family:arrial,sans-serif,verdana;/*字体样式*/
/*缩写成：*/
font:italic small-caps bold 12px/1.5emarrial,sans-serif;

/*注意：Font-size和Line-height用斜杠组合在一起不能分开写。*/

4. 关于背景图片的：

background:#FFF url(log.gif) no-repeat fixed top/cover;
/*颜色   背景图    是否平铺   固定于可视区   上对齐/铺满整个盒子*/

6. 关于列表：

list-style-type:square/none;
list-style-position:inside;
list-style-image:url(filename.gif);
/*缩写成：*/
list-style:none inside url(filename.gif);

二、运用4种方法来引入CSS样式

1.link

/*rel 关系  type 数据类型    href 路径*/

/*部分浏览器支持候选样式,关键字:alternate:*/

2.内部样式块

3.@import url{a.css

注意:此指令必须放在