【问题标题】:IE8 Anchor Text Shadow on HoverIE8 鼠标悬停时锚文本阴影
【发布时间】:2012-04-21 03:28:09
【问题描述】:

我在 ASP.NET 中,但问题完全与 HTML 相关。我有以下代码:

<asp:Panel runat="server" CssClass="message-box">
    <asp:LinkButton ID="LogoutLinkButton" runat="server">Logout</asp:LinkButton>
</asp:Panel>

等效的 HTML 是:

<div class="message-box">
    <a href="#">Logout</a>
</div>

CSS 类是:

a {
    text-decoration: none;
    color: inherit; 
}

.message-box {
    width: 1000px;
    margin: 0 auto;
    text-align: right;  
}

.message-box a:hover {
    text-decoration: underline; 
    text-shadow: 0.1em 0.1em 0.2em black;
}

演示可以在jsFiddle找到。

锚文本的文本阴影在 IE8/IE9 中不起作用。我怎样才能做到这一点?

谢谢。

【问题讨论】:

标签: html css internet-explorer jsfiddle


【解决方案1】:

text-shadow 是一个 css3 属性。所以你不能在 IE 中使用它。 但是您可以使用 filter:shadow 来满足您的要求

【讨论】:

  • 感谢您的回复。我尝试使用 .message-box a:hover { text-decoration: underline;文字阴影:0.1em 0.1em 0.2em 黑色;过滤器:阴影(颜色=#000000,方向=135,强度=5); -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=135,strength=5)"; } 但它不起作用。
  • 附带说明,MDN 通常是浏览器兼容性的良好来源,例如text-shadow browser support on mdn
  • @Tapas 元素必须有 layout 过滤器才能工作。
猜你喜欢
  • 2013-05-19
  • 2012-07-06
  • 1970-01-01
  • 1970-01-01
  • 2010-12-04
  • 2016-03-14
  • 1970-01-01
  • 1970-01-01
  • 2019-03-07
相关资源
最近更新 更多