IEfirefox背景透明,内容不透明

[晴 2008/10/21 09:57 | Author:cailei ]
| |
半透明的方法很多,不同的写法不同的效果

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>


Firefox与IE区别:

* IE:filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)。
* 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>
电脑互联网 » 网页制作 | 评论(1) | 引用(0) | 阅读(362)
China_Y Homepage
2008/10/31 15:29
Alpha 是做法我很欣赏,NewBlack Skin就用这个方法写底下的图片
cailei 回复于 2008/11/01 00:36
这个方法有个局限,就是高度限制,还有一种方法就是可以根据高度自由伸展的,还没来得及写出来,有空整理一下
分页: 1/1 第一页 1 最后页
发表评论
表情
emotemotemotemotemot
emotemotemotemotemot
emotemotemotemotemot
emotemotemotemotemot
emotemotemot
打开HTML
打开UBB
打开表情
隐藏
昵称   密码   游客无需密码
网址   电邮   [注册]
               

验证码 不区分大小写