1、设置背景透明度
background-color:rgba(0,152,50,0.7);// -->70%的不透明度 background-color:transparent;//支持完全透明
2、背景颜色渐变
background: red; /* For browsers that do not support gradients */ background: -webkit-linear-gradient(left, red , yellow); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(right, red, yellow); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(right, red, yellow); /* For Firefox 3.6 to 15 */ background: linear-gradient(to right, red , yellow); /* Standard syntax */
3、选取第几个元素
li:first-child{background:#090} // 第一个元素 li:last-child{background:#090} // 最后一个元素 li:nth-child(3){background:#090} // 第3个元素 li:nth-child(2n) // 偶数标签元素,第2、4、6、8... li:nth-child(2n-1) // 奇数标签元素,第1、3、5、7... li:nth-child(n+3) // 表示选择列表中的标签从第3个开始到最后 li:nth-child(-n+3) // 表示选择列表中的标签从0到3,即小于3的标签 li:nth-last-child(3) //表示选择列表中的倒数第3个标签
4、图片添加模糊效果
.blur { -webkit-filter: blur(10px); -moz-filter: blur(10px); -ms-filter: blur(10px); filter: blur(10px); }