CSS 特效 – 表格透明,內容不透明
CSS有個透明化的參數，調整後可以讓你所指定的物件可以淡化，但因為淡化了，所以該物件裡的文字或圖片也都淡掉了，上網找了一下，有人利用DIV 設定position:absolute; 就可以讓內容不隨著指定的物件淡化掉，不過因為這個參數是變成是以絕對路徑，所以你的內容會跑掉，因此，改調整為 position:relative;就行啦!!
style type=”text/css”>
/*—DW8 www.DW8.ORG—*/
<!–
body {
background-color: #0066FF;
}
#div1
{
position:relative;
/*—這裡定義層不隨表格透明而透明
這樣就可以使表格透明的時候表格裡的
內容和圖片不跟著透明了—*/
}
table
{
background-color:#FFFFFF;
filter:alpha(opacity=50,Style=0);
/*—定義透明度,和淡化的風格
opacity為透明度，值越大透明度越小
style是透明淡化的風格
0 普通透明
1 從左到右漸變淡化
2 圓形像兩邊淡化
3 星狀漸變淡化
默認不設置style參數為0
這個效果同樣可以用再圖片上
—*/
width:300;
height:300;
/*—這裡一定要定義寬度和高度—*/
}
–>
</style>
<body>
<table bgcolor=”#0000FF” style=”display:” id=”tab1″>
<tr>
<td>
<div id=”div1″>
<p>DIV層裡的內容</p>
<p><img src=”http://www.baidu.com/img/logo.gif” width=”174″ height=”59″ /></p>
</div>
</td>
</tr>
</table>
</body>
/*—DW8 www.DW8.ORG—*/
<!–
body {
background-color: #0066FF;
}
#div1
{
position:relative;
/*—這裡定義層不隨表格透明而透明
這樣就可以使表格透明的時候表格裡的
內容和圖片不跟著透明了—*/
}
table
{
background-color:#FFFFFF;
filter:alpha(opacity=50,Style=0);
/*—定義透明度,和淡化的風格
opacity為透明度，值越大透明度越小
style是透明淡化的風格
0 普通透明
1 從左到右漸變淡化
2 圓形像兩邊淡化
3 星狀漸變淡化
默認不設置style參數為0
這個效果同樣可以用再圖片上
—*/
width:300;
height:300;
/*—這裡一定要定義寬度和高度—*/
}
–>
</style>
<body>
<table bgcolor=”#0000FF” style=”display:” id=”tab1″>
<tr>
<td>
<div id=”div1″>
<p>DIV層裡的內容</p>
<p><img src=”http://www.baidu.com/img/logo.gif” width=”174″ height=”59″ /></p>
</div>
</td>
</tr>
</table>
</body>
資料來源:http://www.xker.com/page/e2008/0923/61725.html
近期留言