logo标签列表

样式表对HTML没有影响（但Bootstrap样式有效）

csshtml
3
无论出于何种原因，我似乎无法将我的自定义样式表链接到HTML索引。不过Bootstrap和Font Awesome的样式却完美运行。
我的HTML代码如下： 

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="UTF-8">

  <!--  start of scripts -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <!-- jquery -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <!-- (bootstrap3) Latest compiled and minified JavaScript -->
  <!--  end of scripts -->

  <!-- start of stylesheets -->
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <!-- font awesome -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css">
    <!-- (bootstrap3) Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <!-- (bootstrap3) Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
  <!-- end of stylesheets -->
</head>
  <body>
  </body>
</html>

CSS是：

body {
    background-color: lightblue;
}

文件结构如下:

/root
  /css
    -style.css
  /js
    -scripts.js

  -index.html

2
你的样式表应该在列表的末尾。 - abidishajia
@abidishajia，Bootstrap会重置一些东西。 - Daniel A. White
你的自定义样式表应该放在引入bootstrap链接之后，这样才能生效。否则bootstrap会覆盖你的样式。 - abidishajia
如果你的身体没有内容，那么你如何知道任何东西是否正常工作？ - j08691
3个回答
5

将您的自定义样式表放在head标签中Bootstrap样式表之后。浏览器会按顺序读取，因此自定义样式始终位于最后。在您的代码中，Bootstrap始终优先于您的自定义样式。

<link rel="stylesheet" type="text/css" href="css/style.css">
np - 容易犯的错误 :) - Xoog
1
1
CSS有一些需要注意的地方。样式表按照你添加它们的顺序进行读取，因此你应该将自己的CSS文件添加到末尾，以防止被之前的CSS文件覆盖。
如果你在第一个CSS文件中有.bg{background:red}，并且在最后一个CSS文件中有.bg{background:green}，那么无论何时向元素添加.bg，背景颜色将是绿色而不是红色。
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接