[积累] CSS 点滴学习

没有过专业的培训，用心在实战中学习，效果也不错！

1.background 图片平铺100%，固定不动。

background: url(test.jpg) 50% 0% / cover no-repeat fixed;
-webkit-background-size: cover;

2.鼠标放图片或者文字上有变白的效果：

#main ul.products li a:hover img  { opacity:0.8;filter:alpha(opacity=80) }

3.设置一个区块的圆角与阴影（比如mreald网站）：

-webkit-border-radius: 5px 5px 5px 5px;
-webkit-box-shadow: 0 0 5px #ccc;
border-radius: 5px 5px 5px 5px;
box-shadow: 0 0 5px #ccc;

4. css min max-width ie8 不兼容 用width=

5.设置li行高并居中

ul:  
list-style: none;
li:
height: 40px;
line-height: 40px;
border-bottom: 1px dashed #CCCBAF;
a:
overflow: hidden;

6. 按钮的设置 比如 我的右边的：

border-radius: 3px;
background: #FE9900;
color: #FFF;
padding: 6px 32px;
height: 28px;
line-height: 28px;
text-decoration: none;
hover:
background: #DD4B39;

原文：http://blog.mreald.com/109