css 简写技巧

一些css 简写技巧

1.font 的简写 font 有可选选项和必选选项 如 font-style , font -weight , font-variant ,可写可不写, 但如果写的话必须前置 放到 font-size 和 font-family 前面。 而必选的 font-family   必须放到最后面

p{
 font-style:italic;
 font-weight:bold;
 font-variant:small-caps;
 font-size :12px;
 font-family:Arial;   
}
可以简写成 
p{
font:italic bold small-caps 12px Arial;
}

 2 background 的简写

.div{
background-color: #000;
background-image: url(images/bg.gif);
background-repeat: no-repeat;
background-attachment:fixed;
background-position: top right;
}
简写成
.div{
background: #000 url(images/bg.gif) no-repeat fixed top right;
}

 

3.border

.div{
border-width: 1px;
border-style: solid;
border-color: #000;
}
简写成
.div{
border:1px solid #000
}

4.list-style

li{
list-style-type:disc;
list-style-position:inside;
list-style-image:url(‘a.png‘);
}
简写成
li{
list-style:disc inside url(‘a.png);
}

5.margin padding

.div{
margin-top: 1px;
margin-right: 2px;
margin-bottom: 3px;
margin-left: 4px;
}
简写成
.div{
margin:1px , 2px ,3px ,4px;//从top 开始的顺时针 
}
//margin:5px 10px; 上下5px 左右10px
//margin:1px 2px 3px ;上边距1px 左右2px 下边距3px
//padding 以此类推

  

 

css 简写技巧

原文地址:http://www.cnblogs.com/wangyuhua/p/7255339.html


最新回复(0)
/jishuIV5gOdlKoG9_2FKgPG1k2N8_2FesQqqHSVJAu_2Bp0LQ_3D_3D4719407
8 简首页