我正在写博客，所以我决定使用Bootstrap，因此不必处理媒体查询。我注意到<a>元素是蓝色的。我有另一个在Bootstrap之后加载的CSS文件，如果我使用color: black;，它不会执行任何操作。我尝试了很多解决方案，但是都没有用。这是我的代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Blog</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<link rel="stylesheet" href="css/styles.css" />
</head>
<body class="container">
<header>
<h5>Blog</h5>
<a href="#">Home</a>
<a href="blog.html">Blog</a>
<!--blog.html is the same as this one which is home.html-->
</header>
</body>
</html>
这里是styles.css：
a {
text-decoration: none;
}
header {
text-align: center;
color: black;
}
您需要!important关键字来覆盖样式。
/* Here's styles.css: */
a {
text-decoration: none;
color: black !important;
}
header {
text-align: center;
color: black;
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Blog</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<link rel="stylesheet" href="css/styles.css" />
</head>
<body class="container">
<header>
<h5>Blog</h5>
<a href="#">Home</a>
<a href="blog.html">Blog</a>
<!--blog.html is the same as this one which is home.html-->
</header>
</body>
</html>a标签的引导程序样式似乎比您的更具特异性。因此，可以通过使a的样式比自举更具体来解决。
这里是工作示例
/* Here's styles.css: */
header a {
text-decoration: none;
color: #000;
}
header {
text-align: center;
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Blog</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<link rel="stylesheet" href="css/styles.css" />
</head>
<body class="container">
<header>
<h5>Blog</h5>
<a href="#">Home</a>
<a href="blog.html">Blog</a>
<!--blog.html is the same as this one which is home.html-->
</header>
</body>
</html>如果元素不起作用，您也可以尝试在元素内部使用类。例如，>
This is the css .rmvBlue{ text-decoration: none; }This is the html <a href="#" class="rmvBlue">Home</a> <a href="blog.html" class="rmvBlue">Blog</a>