Opera 和 IE 无法正确归因 css 文本装饰
使用 Opera 11 和 IE 9，这两个浏览器似乎没有正确归属 CSS 文本装饰样式。这在 Chrome、FireFox 和 Safari 中 100% 有效。有人对如何解决这个问题有建议吗？
错误的效果：
正确的效果：
这是 CSS：
#main_title {
font-size: 18px;
color: #000;
font-weight: bold;
}
#main_title a {
color: #000;
}
#main_title_accent {
border: 1px solid #000;
background: #ff9935;
text-decoration: none;
font-size: 20px;
padding: 5px;
}
这是 HTML：
<div id="main_title">
<a href="home">Text <span id="main_title_accent">Goes</span> Here</a>
</div>
Using Opera 11 and IE 9, it seems that these two browsers do not attribute the CSS text-decoration style correctly. This works 100% in Chrome, FireFox and Safari. Does anyone have a suggestion on how to fix this?
The Wrong Effect:
The Right Effect:
Here's the CSS:
#main_title {
font-size: 18px;
color: #000;
font-weight: bold;
}
#main_title a {
color: #000;
}
#main_title_accent {
border: 1px solid #000;
background: #ff9935;
text-decoration: none;
font-size: 20px;
padding: 5px;
}
And this is the HTML:
<div id="main_title">
<a href="home">Text <span id="main_title_accent">Goes</span> Here</a>
</div>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您需要将
display:inline-block赋予#main_title_accent。了解更多信息，请访问 w3c: 16.3.1 - text-decoration 属性
相关报价
实例：http://jsfiddle.net/qp32H/1/
You need to give
display:inline-blockto the#main_title_accent.Read more at w3c: 16.3.1 - text-decoration property
Relevant quote
Live example: http://jsfiddle.net/qp32H/1/