62,267
社区成员
发帖
与我相关
我的任务
分享帮忙看下css的问题
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
body{ background-color:Black; background-attachment:fixed;}
#div1{filter:alpha(Opacity=20);z-index:1; background-color: White; position:absolute; margin:0px; padding:0px;width:200px;}
#div2{ width:200px; z-index:100; position:absolute; margin:0px; padding:0px;}
#div2 .div{ line-height:40px;filter:alpha(Opacity=50); cursor:pointer; color:Black; font-family:@Adobe 繁黑體 Std B; font-weight:900; font-size:14px; width:200px;background-color:White}
#div2 .div span{ margin-left:15px;}
#div2 .div:hover{filter:alpha(Opacity=70);}
#divx{width:200px; line-height:40px; position:relative; z-index:100; background-color: White; font-family:@Adobe 繁黑體 Std B; font-weight:900; font-size:14px; cursor:pointer;}
#divx_{width:200px; line-height:40px; z-index:2; position:absolute; background-color:Red;padding:0px; top:0px; left:200px; display:none}
#div_ div{ line-height:40px}
/* #divx:hover{filter:alpha(Opacity=70);}*/
#divx:hover #divx_{ display:block}
#divx span,divx_ span{ margin-left:15px}
</style>
</head>
<body>
<form id="form1" runat="server">
<div id="div1"></div>
<div id="div2">
<div class="div" style=" margin-top:15px"> <span>我的主页</span> </div>
<div id="divx"><span>文章管理</span>
<div id="divx_">
<div><span> 写新文章</span></div>
<div><span> 文章管理</span></div>
<div><span> 标签管理</span></div>
</div>
</div>
<div class="div"> <span>用户留言</span></div>
<div class="div"><span>评论列表</span> </div>
<div class="div"><span>关于我们</span></div>
</div>
</form>
</body>
</html>
这个在ie8和ie9中都可以
但是效果不是想要的 在 #divx{}中加入 filter:alpha(Opacity=50);后 ie中就没效果了 怎么回事 求解释
...全文
请发表友善的回复…
发表回复
luhaihh 2012-06-15
- 打赏
- 举报
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>lulublog 后台</title>
<script type="text/javascript" src="../Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript" language="javascript">
$(function () {
$("#div1").css("height", $(window).height() - 14 + "px");
$("#div2").css("height", $(window).height() - 14 + "px");
$("#div3").css({ "margin-left": $(window).width() - 214 + "px", "height": $(window).height() - 14 + "px" });
$("#div4").css({ "margin-left": $(window).width() - 214 + "px", "height": $(window).height() - 14 + "px" });
});
</script>
<style type="text/css">
body{ background-image:url(img/admin_bg.jpg); background-attachment:fixed;}
#div1{filter:alpha(Opacity=20);opacity: 0.2; z-index:1; background-color: White; position:absolute; margin:0px; padding:0px;width:200px;}
#div2{ width:200px; z-index:100; position:absolute; margin:0px; padding:0px;}
#div3{filter:alpha(Opacity=50);opacity: 0.5;z-index:2; background-color: White; position:absolute;width:200px;}
#div4{ width:200px; z-index:101; position:absolute; margin:0px; padding:0px}
#div2 div{ line-height:40px;filter:alpha(Opacity=50);opacity: 0.5; cursor:pointer; color:Black; font-family:@Adobe 繁黑體 Std B; font-weight:900; font-size:14px; width:200px;background-color:White}
#div2 div span{ margin-left:15px;}
#div2 div:hover{filter:alpha(Opacity=70);opacity: 0.7; }
.myimg{filter:alpha(Opacity=80); margin-left:15px;opacity: 0.8; height:60px }
.myimg:hover{filter:alpha(Opacity=100);opacity: 1; }
#tdiv_{ display:block; position:absolute; top:0px; left:200px}
#tdiv:hover #tdiv_{ display:block}
</style>
</head>
<body style="overflow-x: hidden;overflow-y: hidden">
<form id="form1" runat="server">
<div id="div1">
</div>
<div id="div2">
<img class="myimg" title="点击查看我的信息" alt="" src="img/user_t/user-1.png" />
<div style=" margin-top:15px">
<span>我的主页</span>
</div>
<div> <span>文章管理</span> </div>
<div><span>写新文章</span></div>
<div><span>文章管理</span></div>
<div><span>标签管理</span></div>
<div>
<span>用户留言</span>
</div>
<div>
<span>评论列表</span>
</div>
<div id="tdiv" style=" position:relative">
<span>关于我们</span>
<div id="tdiv_">
<div style=" line-height:40px">safafd</div>
<div style=" line-height:40px">asfafd</div>
</div>
</div>
</div>
<div id="div3"></div>
<div id="div4">
</div>
</form>
</body>
</html>
这个效果 在ie8中 怎么看不到
蝶恋花雨 2012-06-15
- 打赏
- 举报
alpha是来设置透明度的,它的基本属性是filter：alpha（opacity，finishopacity，
style，startX，startY，finishX，finishY）.
opacity代表透明度数,选值0-100,0是完全透明,100是不透明.
finishopacity用来设置结束时的透明度,以达到渐变效果.取值范围也是0-100.style指渐变类型,0是无变化,1是线行渐变,2是放射渐变,3是X型渐变.
参考
http://hi.baidu.com/ouanan/blog/item/c9c377c43eaee4ce38db4943.html
http://hi.baidu.com/ate0611/blog/item/de9f79fabcc146839e5146ca.html
style，startX，startY，finishX，finishY）.
opacity代表透明度数,选值0-100,0是完全透明,100是不透明.
finishopacity用来设置结束时的透明度,以达到渐变效果.取值范围也是0-100.style指渐变类型,0是无变化,1是线行渐变,2是放射渐变,3是X型渐变.
参考
http://hi.baidu.com/ouanan/blog/item/c9c377c43eaee4ce38db4943.html
http://hi.baidu.com/ate0611/blog/item/de9f79fabcc146839e5146ca.html
