css 简化,CSS代码简化

盒模型代码缩写

margin(外边距)padding(内边距)border(边框)

设置方向是按照顺时针上右下左顺序。

如果left和right值相同

margin:10px 20px 30px 20px;

可以写成：

margin:10px 20px 30px;

字体缩写

body{

font:italic small-caps bold 12px/1.5em "宋体",sans-serif;

}

1、简写方式你至少要指定 font-size 和 font-family 属性，其他的属性(如 font-weight、font-style、font-varient、line-height)如未指定将自动使用默认值。

2、在缩写时 font-size 与 line-height 中间要加入“/”斜扛。

因为对于中文网站，英文还是比较少的，所以下面缩写代码比较常用：

body{

font:12px/1.5em "宋体",sans-serif;

}

只是有字号、行间距、中文字体、英文字体设置。

颜色值

有字体颜色(color)背景颜色(background-color)边框颜色(border)

设置颜色有：1、英文命令颜色 2、RGB颜色 3、十六进制颜色

em指元素给定字体的 font-size 值，如果元素的 font-size 为 14px ，那么 1em = 14px；

p{font-size:12px;text-indent:2em;}

上面代码可以实现段落首行缩进 24px(也就是两个字体大小的距离)。

打开App，阅读手记