时间戳

首页 > 解决方案 > CSS 将颜色从灰色更改为 #330000

html - CSS 将颜色从灰色更改为 #330000

问题描述

所以我是新手，但我从 W3 学校得到了这个，我正在尝试为班级应用颜色 - 所以我创建了样式部分并尝试应用颜色，但它不起作用。我知道这与外部样式表相关联，所以这可能会覆盖我想要做的事情。否则，我看不到该怎么做，我已经搜索了一个小时左右，此时我需要有更多知识的人来帮助我。

<!DOCTYPE html>
<html lang="en">

<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <style>
    .label label-default {
      background color: #330000;
    }
  </style>

</head>

<body>



  <h1><span class="label label-default">Survey</span>



</body>

</html>

标签： htmlcss

解决方案

你有3个问题

  1. 选择器不好。<span class="label label-default">. 如果你想选择这个，你需要写.label.label-default

您应该使用multi class selector, 在这里阅读 ->多类选择器

阅读有关CSS 选择器的更多信息

  1. background color风格也不对。你需要写background-color

在这里阅读更多 ->背景颜色

  1. h1标签必须关闭</h1>

在此处阅读更多内容 -> HTML 元素

我自己的问题->如果您不拆分内容或有其他原因，为什么要在span内部使用？h1例如<h1><span class="font-light">Light</span>Not Light</h1>。

如果你没有特殊原因在里面使用span h1，你应该classes直接在里面加上h1

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <style>
  
  .label.label-default {
  background-color:#330000;
  }
  
  </style>
  
</head>
<body> 
 


  <h1><span class="label label-default">Survey</span></h1>
  


</body>
</html>

我知道这链接到外部样式表，所以也许这会覆盖我想要做的 -> 链接的样式表是引导样式表。要检查这是否覆盖了您自己的自定义 css，请在开发人员控制台中检查您的代码，看看您的样式是否被删减。然后它们被覆盖。

我已经用谷歌搜索了一个小时左右-> 然后你应该学习如何问谷歌。你遇到的问题很基本。Google-ingmulti class selector css甚至2 classes css +background color css会给你很多结果和答案

推荐阅读