天行博客

颜色缩写   

我们可以将#ff0099缩写成#f09，#ffffff，   

缩写成#fff。(小技巧，用记事本等工具的替换功能，可直接输入#ff0099将CSS文件内全部替换成#f09)   

使用 line-height 垂直居中   

例如：line-height:22px;   

固定宽度的容器需要一行垂直居中时，使用 line-height 即可。   

背景(background)属性多参数简写   

例如：   

background-image: url("huceo.png");   

background-position: top center;   

background-repeat: no-repeat;   

其实可以写成:   

background: url(huceo.png) no-repeat top center;   

背景图片路径不加引号   

background:url("image/huceocom.gif") #999;    

可以写为   

background:url(images/huceo.gif) #999;    

定位属性值为0的值可去掉单位(如:px/em)   

例如：padding: 10px 8px 0px 0px;   

简写：padding: 10px 8px 0 0;   

有相等值可合并   

例如：padding: 10px 8px 10px 8px;   

简写：padding: 10px 8px;   

Margin(外边距/空白边),Padding(内边距)声明:   

例如：   

margin-top:0px;   

margin-right:10px;   

margin-bottom:0px;   

margin-left:10px;   

简写:   

margin:0 10px 0 10px;(上-右-下-左)   

再简写：   

margin:0 10px;(上下值为0，左右值为10)   

Borders(边框属性)   

例如：   

border-width:1px;   

border-style:solid;   

border-color:#000;   

简写:   

border:1px solid #000;   

多组共用属性   

例如：规定h1到h6使用同一属性（英文逗号间隔）   

h1,h2,h3,h4,h5,h6   

margin:0;   

padding:0;   

font-size:12px;   

font-weight:normal;   

....   

当CSS中有相同属性时都可以归类到一起，使用共同属性   

CSS简写技巧有很多，更具体的可以百度一下。建议大家尽量使用CSS简写来优化代码，减少文件体积。   

清除容器浮动   

#main {   

    overflow:hidden;   

}   

不让链接折行   

a {   

    whitewhite-space:nowrap;   

}   

始终让 Firefox 显示滚动条   

html {   

    overflow:-moz-scrollbars-vertical;   

}   

跨浏览器的支持   

body, html {   

    min-height:101%;   

}   

最简单的 CSS 重置   

* {   

   margin: 0; padding: 0   

}