CSS技巧：圓角效果

        需要切1個透明的圓形圖片(這個圖片要求圓角內側是透明的，外側是不透明的)，用絕對定位來顯示4個圓角，這樣做的好處是隻使用1個圖片，就可以實現任何大小，任何背景顏色的box圓角，程式碼如下：

<style type="text/css">

      .b_box_ie{

      text-align:center;width:200px;line-height:60px;

       background-color:#DBEAFF;

       position:relative;

    }

    .b_r{width:3px;height:3px;font-size:0;background:url(2010062419324216.gif)no-repeat;position:absolute;}

    .r_1{top:0;left:0;}

    .r_2{background-position:-3px0;top:0;right:0;}

    .r_3{background-position:0-3px;left:0;bottom:0;}

    .r_4{background-position:-3px-3px;bottom:0;right:0;}

</style>

<div class="b_box_ie">

    CSS 圓角

    <div class="b_rr_1"></div>

    <div class="b_rr_2"></div>

    <div class="b_rr_3"></div>

    <div class="b_rr_4"></div>

</div>

效果：

CSS技巧：陰影效果

.b_shadow{

     height:60px;line-height:60px;

     width:200px;border:1px solid#C0C0C0;background-color:#DBEAFF;

     -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0,0.5);

     -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0,0.5);

     box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);

/*IE*/ 

     filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5,OffY=5,Color='gray');

}

<div class="b_shadow">CSS陰影</div>

效果：

css技巧：半透明效果

<style>

     .div1 a:hover img{filter:alpha(Opacity=80); opacity: 0.8}

</style>

<p>滑鼠移動到A超連結時，超連結內圖片（img）呈現半透明顯示80%效果。</p>

<div class="div1">

     <a href="#"><img src="999.jpg"/></a>

</div>

解釋：
filter 設定IE半透明效果樣式，值1-100，值越小越透明

opacity對非IE瀏覽器設定，比如火狐