Question

我是第一次在这里发帖。我正在为一个在线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中提到的所有解决方案，而这些解决方案对我没有用。

Answer 1

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

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

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

文字装饰：无;不工作

2 个答案: