半透明的方法很多,不同的写法不同的效果
1.普通背景透明,FIREfox与IE同时透明,包括表格里所有的内容都变得透明
Firefox与IE区别:
2.IE与Firefox同时兼容透明,但内容不透明,这个效果很都有帮助!
1.普通背景透明,FIREfox与IE同时透明,包括表格里所有的内容都变得透明
<html>
<head>
<title>透明表格</title>
</head>
<body background="图片">
<table border="0">
<tr>
<td style="background-color:#336699;filter:Alpha(opacity=50)">表格内容</td>
</tr>
</table>
</body>
</html>
<head>
<title>透明表格</title>
</head>
<body background="图片">
<table border="0">
<tr>
<td style="background-color:#336699;filter:Alpha(opacity=50)">表格内容</td>
</tr>
</table>
</body>
</html>
Firefox与IE区别:
* IE:filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)。
* FF:opacity:0.6。
* FF:opacity:0.6。
2.IE与Firefox同时兼容透明,但内容不透明,这个效果很都有帮助!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<title>透明</title>
<head>
<style>
#popupmenu_popup {
color: #154BA0;
border: 1px solid #86B9D6;
background: #D9EEF9;
filter: Alpha(Opacity=50, Style=0);
opacity: 0.50;
position: absolute;
z-index: 30;
left:300px;
top: 64px;
height: 69px;
width:134px;
}
#popupmenu_text {
color: #154BA0;
position: absolute;
z-index: 40;
left:301px;
top: 65px;
height: 69px;
width:134px;
text-align:center;
}
</style>
</head>
<body >
<div id="popupmenu_popup"></div>
<div id="popupmenu_text">背景半透明但文字不透明</div>
</body>
</html>
<HTML xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<title>透明</title>
<head>
<style>
#popupmenu_popup {
color: #154BA0;
border: 1px solid #86B9D6;
background: #D9EEF9;
filter: Alpha(Opacity=50, Style=0);
opacity: 0.50;
position: absolute;
z-index: 30;
left:300px;
top: 64px;
height: 69px;
width:134px;
}
#popupmenu_text {
color: #154BA0;
position: absolute;
z-index: 40;
left:301px;
top: 65px;
height: 69px;
width:134px;
text-align:center;
}
</style>
</head>
<body >
<div id="popupmenu_popup"></div>
<div id="popupmenu_text">背景半透明但文字不透明</div>
</body>
</html>
China_Y
2008/10/31 15:29
Alpha 是做法我很欣赏,NewBlack Skin就用这个方法写底下的图片
cailei 回复于 2008/11/01 00:36
这个方法有个局限,就是高度限制,还有一种方法就是可以根据高度自由伸展的,还没来得及写出来,有空整理一下
分页: 1/1
1
1
这是什么?
div+css兼容IE和firefox下的最小高度设置
2008/10/21 09:57 | Author:



