文字装饰：无；不工作[重复]答案

【问题标题】：Text-decoration: none; not working [duplicate]文字装饰：无；不工作[重复]
【发布时间】：2017-03-28 12:39:19
【问题描述】：

我是第一次在这里发帖。我正在为一个在线 Web 开发课程做一个项目，我使用页脚标签创建了一个页脚，我正在使用 Bootstrap CSS 文件和我的 CSS 文件。我使用锚标记添加链接，但由于某种原因我无法删除文本装饰，我尝试了内部、外部和内联样式表，但没有任何效果。这是下面的页脚代码，这个页脚页面已经使用 include() 函数包含在我的 index.php 文件中。

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Latest compiled and minified Bootstrap CSS -->
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" type=" text/css">
<!-- My CSS -->
<link rel="stylesheet" href="bootstrap/css/style.css" type=" text/css">
<!-- jQuery library -->
<script src="bootstrap/js/jquery.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="bootstrap/js/bootstrap.min.js"></script>   
</head>
<body>    
<footer>
    <div class="container">
        <div class="row">
            <div class="col-xs-6 col-sm-4">
                <h4>Information</h4>  
            </div>
            <div class="col-xs-6 col-sm-4">
                <h4>My Account</h4>                    
            </div>
            <div class="col-xs-6 col-sm-4">
                <h4>Contact Us</h4>              
            </div>
        </div>
        <div class="row">
            <div class="col-xs-6 col-sm-4">
                <p><a href="">About Us</a><br>
                   <a href="">Contact Us</a>
                </p>  
            </div>
            <div class="col-xs-6 col-sm-4 content">
                <p><a href="">Login</a><br>
                   <a href="">Signup</a>
                </p>                    
            </div>
            <div class="col-xs-6 col-sm-4">
                <p>Contact: +91-9742485069</p>              
            </div>
        </div>    
    </div>                                      
</footer>
</body>    
</html>

我应该在我的 CSS 文件中包含什么来从链接中删除文本装饰？如果我的问题对任何人都没有意义，请原谅我，这是第一次在这里发布。

这个问题被标记为重复，但我已经尝试了另一个问题See this question 中提到的所有解决方案，但这些解决方案对我不起作用。

【问题讨论】：

我没有看到任何删除锚标签上的装饰的尝试？
那是因为我尝试了多种去除装饰的方法，但没有任何效果。
我认为 Bootstrap CSS 文件覆盖了我的 CSS 文件中的选择器。
把你的css文件放在boostraps之后！这就是 CSS 中的 C 代表 cascading
@RiggsFolly 我的 css 包含在代码中的引导 css 之后。

标签： php html css twitter-bootstrap

【解决方案1】：

不确定，但你想要这个？ See this fiddle

.footer a { color: #fff; }
.footer a:hover { text-decoration: none; }

【讨论】：

试过了，没用:(
检查选择器的特殊性：developer.mozilla.org/en-US/docs/Web/CSS/Specificity 检查锚点上应用的浏览器检查器中是否有!important 值，它应该可以解决您的问题
我检查并检查了，但没有 !important 应用于锚点的值。
您能否准确地修改您的代码，以便我更有效地帮助您？
好吧，我想修改一下我的代码，但我现在遇到了另一个问题。 Bootstrap 现在不适合我，昨天它工作得很好。我会先尝试解决这个问题:(

【解决方案2】：

在悬停选择器中添加 text-decoration:none

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

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
   
<footer>
    <div class="container">
        <div class="row">
            <div class="col-xs-6 col-sm-4">
                <h4>Information</h4>  
            </div>
            <div class="col-xs-6 col-sm-4">
                <h4>My Account</h4>                    
            </div>
            <div class="col-xs-6 col-sm-4">
                <h4>Contact Us</h4>              
            </div>
        </div>
        <div class="row">
            <div class="col-xs-6 col-sm-4">
                <p><a href="">About Us</a><br>
                   <a href="">Contact Us</a>
                </p>  
            </div>
            <div class="col-xs-6 col-sm-4 content">
                <p><a href="">Login</a><br>
                   <a href="">Signup</a>
                </p>                    
            </div>
            <div class="col-xs-6 col-sm-4">
                <p>Contact: +91-9742485069</p>              
            </div>
        </div>    
    </div>                                      
</footer>

【讨论】：

试过了，没用。