3:个别的圆角

如果按照过去的习惯做法，会浪费你很多时间，现在CSS3能快速解决!

我们现在只想让div的右上和右下是圆角，那么仅需稍作修改:

#indie {
background-color: #000;
border: 1px solid #000;
-moz-border-radius-topright: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-top-left-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
}

试想一下这种做法会用在网页中的什么元素呢？对！就是标签式的导航按钮！

4:以CSS3的方式修改不透明度

现在你可以按惯例编写几行代码来实现不透明度的效果(hack)。不过CSS3简化了这个流程。加此信息网页教学网（webjx.com）发布目的是为了防止你变懒！webjx.com不主张采集！

这行代码很好记，仅仅是 “opacity: value;”:

#opacity {
background-color: #000;
opacity: 0.3;
}

5:阴影效果

实现阴影也有很多方法，最常用的就是使用Photoshop制作成阴影图片，然后应用到背景属性中。但CSS3让你的工作更有效率，不幸的是，目前只有Safari和Chrome支持这个新特性。

仅仅需要一行代码，不过它有4个不同的值:

-webkit-box-shadow: 3px 5px 10px #ccc;

下面我来解释一下这四个值都代表什么，第一个3px是指定阴影与div元素之间的水平(横向)距离，第二个5px指的是阴影与div之间的垂直(纵向)距离，第三个10px指的是阴影的模糊度(类似于photoshop中的羽化)，值越大越细腻。最后的值不说大家也知道，就是阴影的颜色。

我们最终阴影效果代码；

#shadow {
background-color: #fff;
border: 1px solid #000;
-webkit-box-shadow: 3px 5px 10px #ccc;
}

正如你看到的，我们个这个div设置了白色的背景，黑色的边框和亮灰色的阴影。