0 Comments

学习笔记 剖析CSS缩写六大规则(1)

发布于:2013-08-21  |   作者:广州网站建设  |   已聚集:人围观

CSS布局有很多值得学习的地方,这里向大家描述一下CSS缩写的规则,使用CSS缩写可以帮助减少你CSS文件的大小,更加容易阅读。

CSS常用缩写语法

使用CSS缩写可以帮助减少你CSS文件的大小,更加容易阅读。CSS缩写的主要规则如下:
广州网站建设,网站建设,广州网页设计,广州网站设计

颜色

16进制的色彩值,如果每两位的值相同,可以缩写一半,例如:
#000000可以缩写为#000;

#336699可以缩写为#369;

盒尺寸

通常有下面四种书写方法:

property:value1;表示所有边都是一个值value1;
property:value1value2;表示top和bottom的值是value1,right和left的值是value2
property:value1value2value3;表示top的值是value1,right和left的值是value2,bottom的值是value3
property:value1value2value3value4;四个值依次表示top,right,bottom,left
方便的记忆方法是顺时针,上右下左。具体应用在margin和padding的例子如下: 


  1. margin:1em02em0.5em;  
  2.  

边框(border)
广州网站建设,网站建设,广州网页设计,广州网站设计

边框的属性如下:


  1. border-width:1px;  
  2. border-style:solid;  
  3. border-color:#000;  
  4.  

可以缩写为一句:


  1. border:1pxsolid#000;  
  2.  

语法是border:widthstylecolor。

标签:
飞机