我有一个跨度,我只想在光标悬停在它上面时显示它。要查看我期望的内容,请删除“href”属性并在非 IE 浏览器中尝试。
<!-- <!DOCTYPE html> -->
<html>
<head>
<style>
.container {
color: orange;
}
a.anchor {
text-decoration:none;
display: inline-block;
cursor: default;
}
a.anchor:hover span {
visibility: visible;
}
a.anchor span {
visibility: hidden;
}
</style>
</head>
<body>
<div class="container">
<a class="anchor" href="#">
<span>XXXXXXXXX</span>
</a>
</div>
</body>
</html>
请注意,doctype 已被注释掉,以使 IE 进入怪癖模式。在此模式下,IE a:hover 不适用于列出的 CSS(可见性更改器),除非 anchor 包含“href”属性。
但是,通过添加“href”,IE 会使用浏览器的默认 anchor 样式覆盖 span 的样式。在我的应用程序中,容器 div 可以具有动态样式,因此很难过度覆盖 anchor 的样式...
所以我的问题是:
1) 我只能使用 quirks 模式。无论如何,我是否可以在不使用 href 属性的情况下按照我想要的方式获得 :hover 行为?
2) 如果上一个问题的答案是否定的,那么删除所有浏览器默认 anchor 样式的最佳方法是什么?
我真的不希望为此编写脚本,但是如果有任何脚本解决方案请告诉我!
提前谢谢大家。
最佳答案
尝试
a.anchor:hover span {
display: inline-block;
}
a.anchor span {
display: none;
}
关于html - IE 怪癖模式 a :hover style issue,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9041789/