圆角盒子：.box{ -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; -o-border-radius:5px 5px 5px 5px; border-radius: 5px 5px 5px 5px;}
阴影盒子：.box{ -moz-box-shadow:5px 5px 10px gray; -webkit-box-shadow:5px 5px 10px gray; -o-box-shadow:5px 5px 10px gray; box-shadow:5px 5px 10px gray;}
线性渐变:.box{ background-color: #f3f3f3; background: -webkit-linear-gradient(top,#F8F8F8 0,#eeeeee 100%);//代表从上到下，从白到蓝的渐变 background: -moz-linear-gradient(top,#F8F8F8 0,#eeeeee 100%); background: -o-linear-gradient(top,#F8F8F8 0,#eeeeee 100%); background: linear-gradient(to bottom,#F8F8F8 0,#eeeeee 100%);}
放射性渐变:.box{ background-color: #f3f3f3; background: -webkit-radial-gradient(circle,white,blue);//代表圆心是白色，然后逐渐的过渡到圆周的蓝色 background: -moz-radial-gradient(circle,white,blue); background: -o-radial-gradient(circle,white,blue); background: radial-gradient(circle,white,blue);}
透明盒子：1)使用rgba()函数：接受4个参数，分别代表red、green、blue中的三个值，取值范围是0-255，最后一个值是alpha不透明度 #div{ background:rgb(170,240,0); background:rgba(170,240,0,0.5); }2)使用opacity #div{ background:rgb(170,240,0); opacity:0.5; filter:alpha(opacity=50); }
文字阴影：.demo1 { text-shadow: red 0 1px 0;}text-shadow: X-Offset Y-Offset Blur ColorX-Offset表示阴影的水平偏移距离，其值为正值时阴影向右偏移，如果其值为负值时，阴影向左偏移；Y-Offset是指阴影的垂直偏移距离，如果其值是正值时，阴影向下偏移反之其值是负值时阴影向顶部偏移；Blur是指阴影的模糊程度，其值不能是负值，如果值越大，阴影越模糊，反之阴影越清晰，如果不需要阴影模糊可以将Blur值设置为0；Color是指阴影的颜色，其可以使用rgba色。