css - 文字装饰：没有不起作用

Question

完全一脸懵逼！我试过用text-decoration: none几种不同的方式重写这条线。我还设法通过定位文本来调整文本大小，但text-decoration: none代码不会占用。

非常感谢帮助。

代码

.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>

score 49 · Accepted Answer

49

a:link{
  text-decoration: none!important;
}

=> 和我一起工作 :) ，祝你好运

于 2015-05-26T02:20:32.547 回答

score 43 · Accepted Answer

内联元素 (a) 中有一个块元素 (div)。这适用于 HTML 5，但不适用于 HTML 4。因此也只有实际支持 HTML 5 的浏览器。

当浏览器遇到无效标记时，它们会尝试修复它，但不同的浏览器会以不同的方式修复它，因此结果会有所不同。有些浏览器会将块元素移到内联元素之外，有些浏览器会忽略它。

score 10 · Accepted Answer

使用CSS 伪类并给你的标签一个类，例如：

<a class="noDecoration" href="#">

并将其添加到您的样式表中：

.noDecoration, a:link, a:visited {
    text-decoration: none;
}

score 7 · Accepted Answer

在您的标题标签上添加此语句：

<style>
a:link{
  text-decoration: none!important;
  cursor: pointer;
}
</style>

score 3 · Accepted Answer

3

尝试将您text-decoration: none;的 a:hover css。

于 2014-01-26T14:47:50.177 回答

score 3 · Accepted Answer

如果你想要一个导航栏

ul{ list-style-type: none; } li{text-decoration: none;

这将使它想要将列表类型的样式设置为 None 或 nothing

使用 < a > 标签：

a:link {text-decoration: none}

score 2 · Accepted Answer

我有一个答案：

<a href="#">
    <div class="widget">  
        <div class="title" style="text-decoration: none;">Underlined. Why?</div>  
    </div>
</a>

有用。

score 2 · Accepted Answer

为所有链接添加一个特定的类：

html：

<a class="class1 class2 noDecoration"> text </a>

在 CSS 中：

.noDecoration {
  text-decoration: none;
}

score 1 · Accepted Answer

即使我删除了 'text-decoration: none;' 也没有下划线从你的代码。但我也有类似的经历。

然后我添加了一个代码

a{
 text-decoration: none;
}

和

a:hover{
 text-decoration: none;
}

所以，用 :hover 试试你的代码。

score 1 · Accepted Answer

当我尝试自定义 WordPress 主题并且文本装饰对我没有帮助时，我感到非常头疼。在我的情况下，我也必须删除 box-shadow 。

a:hover {
    text-decoration: none;
    box-shadow: none;
}

score 1 · Accepted Answer

作为旁注，请记住，在其他情况下，代码库可能会使用border-bottomcss 属性，例如border-bottom: 1px;，它会产生与text-decoration: underline. 在这种情况下，请确保将其设置为无，border-bottom: none;

score 0 · Accepted Answer

0

尝试将此添加到您的样式表中：

a {text-decoration:none;}

于 2012-07-10T18:59:49.360 回答

score 0 · Accepted Answer

我使用下面的代码让我在 Chrome 中工作。您可以调整嵌套：

a:-webkit-any-link { color: black; }

score -8 · Accepted Answer

我只是按照我知道它不正确但它快速修复的旧方法来做。

<h1><a href="#"><font color="#FFF">LINK</font></a></h1>

css - 文字装饰：没有不起作用

14 回答 14

Related

Reference