gpt4 book ai didi

css - 此代码在 ie 中不起作用(悬停以显示元素)

转载 作者:行者123 更新时间:2023-11-28 15:31:26 26 4
gpt4 key购买 nike

此代码在 ie 中不起作用(悬停以显示元素)

请帮助我了解 css 谢谢。

<style type="text/css">
body {
font: 14px/1.4 arial;
}
.imgWrap {
position: relative;
width: 140px;
height: 112px;
}
.imgDescription {
margin-top: -90px;
margin-left: 144px;
width: 728px;
height: 90px;
position: absolute;
visibility: hidden;
opacity: 0;
-moz-opacity: 0.00;
filter: alpha(opacity=0);
}
.imgWrap:hover .imgDescription {
visibility: visible;
opacity: 1;
-moz-opacity: 1.00;
filter: alpha(opacity=100);
}
</style>

<div class="imgWrap">
<img src="http://3.envato-static.com/assets/header-footer/microlancer/web-development-services-e546173320569b008737e36c59b25782.jpg" alt="polaroid" />
<div class="imgDescription"><img src="http://static.adzerk.net/Advertisers/d893babe671c41118c1fece177e0a21a.jpg"/></div>
</div>

最佳答案

您应该避开过滤器,它对您不起作用。另外,对我来说,.imgDescription 中的图像不喜欢被链接到。

我删除了所有的不透明度和过滤信息(如果你绝对定位了隐藏可见性的元素,你就不需要它)并更改了 .imgDescriptionbackground-color code> 所以你可以看到它是有效的。

IE 7、8(使用 IE 9 呈现)工作正常(尽管 IE 7 的 div 定位不佳,但它仍然可以工作。

http://jsfiddle.net/7Jvcy/

测试 IE 7 和 8 中的输出:http://fiddle.jshell.net/7Jvcy/show/

.imgDescription {
margin-top: -90px;
margin-left: 144px;
width: 728px;
height: 90px;
position: absolute;
visibility: hidden;
background-color: #f00;
}
.imgWrap:hover .imgDescription {
visibility: visible;
}

关于css - 此代码在 ie 中不起作用(悬停以显示元素),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20651558/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com