DIV CSS 佈局教程網

上節我們介紹了DIV樣式中的常用屬性，那麼你對DIV樣式的特殊效果是否了解，這裡和大家簡單分享一下，相信本文介紹一定會讓你有所收獲。

DIV樣式中一些特殊效果：

1、cursor:設置DIV上光標的樣式。

2、clip:設置剪輯矩形。

例：

Code

<divstyledivstyle="font:16px宋體;width:600px;height:200px;cursor:help;  
clip:rect(0px100px20px0px);line-height:20px;overflow:auto;background-color:Yellow;position:absolute"> 
div樣式測式howareyou.  
</div> 

說明：clip:rect(toprightbottomleft);設置上下左右的距離,但此時要把position指定為absolute。看以上效果。

3、DIV樣式特殊效果之filter:濾鏡效果。

例：

Code

<divstyledivstyle="width:450px;height:200px;background-color:Blue;"> 
<dividdivid=”tdiv”style="background-color:Yellow;filter:alpha(opacity=50);opacity:0.5;  
float:left;width:200px;height:200px;"> 
</div> 
<divstyledivstyle="background-color:Yellow;width:200px;height:200px;float:left;"> 
</div> 
</div> 

說明：設置透明度:opacity：value(FF專用,value的取值為0至1之間的小數)，filter:alpha(opacity=value)(IE專用，value取值：0至100)。

如果要有JavaScript改變DIV的透明度可用下面的方法：

FF中：document.getElementById('tdiv').style.opacity='0.9';

IE中：document.getElementById('tdiv').style.filter='alpha(opacity=90)';