学习下DIV+CSS网页结构技能实例4：利用css缩写

我在这里借用了新浪博客的盒子来说明下，大家可能发现了，其实边框border往往就只有1px的宽度，谁叫它是边框呢。利用缩写能够匡助削减你CSS文件的巨细，加倍简单浏览。css缩写的次要划定规矩请参看《经常使用css缩写语法总结》，css缩写的次要划定规矩以下：
色彩

16进制的色采值，假如每两位的值不异，能够缩写一半，比方：
#000000能够缩写为#000;#336699能够缩写为#369;
注重:在统一个CSS设置节中，不要交织利用全写和缩写的色彩设置，在体系资本极低时，会招致扫瞄器衬着失利。
盒尺寸

一般有上面四种誊写办法:
property:value1;暗示一切边都是一个值value1；property:value1value2;暗示top和bottom的值是value1,right和left的值是value2property:value1value2value3;暗示top的值是value1，right和left的值是value2，bottom的值是value3property:value1value2value3value4;四个值顺次暗示top,right,bottom,left便利的影象办法是顺时针，上右下左。详细使用在margin和padding的例子以下：
margin:1em02em0.5em;

边框(border)

边框的属性以下：
border-width:1px;border-style:solid;border-color:#000;能够缩写为一句：border:1pxsolid#000;
语法是border:widthstylecolor;
背景(Backgrounds)

背景的属性以下：
background-color:#f00;background-image:url(background.gif);background-repeat:no-repeat;background-attachment:fixed;background-position:00;能够缩写为一句：background:#f00url(background.gif)no-repeatfixed00;
语法是background:colorimagerepeatattachmentposition;
你能够省略个中一个或多个属性值，假如省略，该属性值将用扫瞄器默许值，默许值为：
color:transparentimage:nonerepeat:repeatattachment:scrollposition:0%0%字体(fonts)

字体的属性以下：
font-style:italic;font-variant:small-caps;font-weight:bold;font-size:1em;line-height:140%;font-family:"LucidaGrande",sans-serif;能够缩写为一句：font:italicsmall-capsbold1em/140%"LucidaGrande",sans-serif;
注重，假如你缩写字体界说，最少要界说font-size和font-family两个值。
列表(lists)

作废默许的圆点和序号能够如许写list-style:none;,
list的属性以下:
list-style-type:square;list-style-position:inside;list-style-image:url(image.gif);能够缩写为一句：list-style:squareinsideurl(image.gif);
方便性：课外，我们了解到现在流行的LBS系统、PJBLOG、php下面的WP、MT，都是采用Div+css构架。在平时的练习中我们就遇到过