Html 文字装饰：无不工作
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11419998/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Text-decoration: none not working
提问by Olly F
Totally baffled! I've tried rewriting the text-decoration: noneline several different ways. I also managed to re-size the text by targeting it but the text-decoration: nonecode will not take.
完全懵了！我试过用text-decoration: none几种不同的方式重写这条线。我还设法通过定位文本来重新调整文本大小，但text-decoration: none代码不会占用。
Help much appreciated.
非常感谢帮助。
Code
代码
.widget
{
height: 320px;
width: 220px;
background-color: #e6e6e6;
position: relative;
overflow: hidden;
}
.title
{
font-family: Georgia, Times New Roman, serif;
font-size: 12px;
color: #E6E6E6;
text-align: center;
letter-spacing: 1px;
text-transform: uppercase;
background-color: #4D4D4D;
position: absolute;
top: 0;
padding: 5px;
width: 100%;
margin-bottom: 1px;
height: 28px;
text-decoration: none;
}
a .title
{
text-decoration: none;
}<a href="#">
<div class="widget">
<div class="title">Underlined. Why?</div>
</div>
</a>回答by Guffa
You have a block element (div) inside an inline element (a). This works in HTML 5, but not HTML 4. Thus also only browsers that actually support HTML 5.
内联元素 (a) 中有一个块元素 (div)。这适用于 HTML 5，但不适用于 HTML 4。因此也只有实际支持 HTML 5 的浏览器。
When browsers encounter invalid markup, they will try to fix it, but different browsers will do that in different ways, so the result varies. Some browsers will move the block element outside the inline element, some will ignore it.
当浏览器遇到无效标记时，它们会尝试修复它，但不同的浏览器会以不同的方式进行修复，因此结果会有所不同。有些浏览器会将块元素移到内联元素之外，有些浏览器会忽略它。
回答by DongNguyen
a:link{
text-decoration: none!important;
}
=> Working with me :) , good luck
=> 和我一起工作 :) 祝你好运
回答by Mimeshead
Use CSS Pseudo-classesand give your tag a class, for example:
使用CSS 伪类并为您的标签指定一个类，例如：
<a class="noDecoration" href="#">
and add this to your stylesheet:
并将其添加到您的样式表中：
.noDecoration, a:link, a:visited {
text-decoration: none;
}
回答by Ram Madhavan
Add this statement on your header tag:
在您的标题标签上添加此语句：
<style>
a:link{
text-decoration: none!important;
cursor: pointer;
}
</style>
回答by Esci Villagonzalo Morales
Try placing your text-decoration: none;on your a:hover css.
尝试将您text-decoration: none;的 a:hover css 放在您的位置。
回答by PIZZZZZZZZZZZA is here
if you want a nav bar do
如果你想要一个导航栏
ul{ list-style-type: none; } li{text-decoration: none;
- This will make it want to make the style of the list type to None or nothing
- 这将使它想要将列表类型的样式设置为 None 或没有
with the < a > tag:
使用 < a > 标签：
a:link {text-decoration: none}
回答by SungWoo_Park
There are no underline even I deleted 'text-decoration: none;' from your code. But I had a similar experience.
即使我删除了 'text-decoration: none;' 也没有下划线 从你的代码。但我也有过类似的经历。
Then I added a Code
然后我添加了一个代码
a{
text-decoration: none;
}
and
和
a:hover{
text-decoration: none;
}
So, try your code with :hover.
所以，用 :hover 试试你的代码。
回答by Zoltan Febert
I had lots of headache when I tried to customize a WordPress theme and the text-decoration didn't help me. In my case I had to remove the box-shadow as well.
当我尝试自定义 WordPress 主题时，我很头疼，而文本装饰对我没有帮助。在我的情况下，我也必须删除框阴影。
a:hover {
text-decoration: none;
box-shadow: none;
}
回答by Alouani Younes
Add a specific class for all the links :
为所有链接添加一个特定的类：
html :
html :
<a class="class1 class2 noDecoration"> text </a>
in css :
在 CSS 中：
.noDecoration {
text-decoration: none;
}
回答by jnhy
I have an answer:
我有一个答案：
<a href="#">
<div class="widget">
<div class="title" style="text-decoration: none;">Underlined. Why?</div>
</div>
</a>?
It works.
有用。
