Question

我试图找出如何格式化整个网站中不同的元素。例如，导航栏中我列表的背景是绿色。我在列表中列出了多个项目。它会自动将所有格式放入导航栏，并按应有的方式将其放入列表中。

我的问题是如何制作一个ID或CLASS来删除导航栏中使用的格式，以便在我的身体中为此列表创建自己的格式。我尝试查找youtube视频并进行谷歌搜索，但是我发现所有的格式只能同时设置多个选择器。

如何为导航栏中的列表覆盖CSS？

在我的课上，我尝试做然后ul.amazon01 {background-color：none;它不起作用。

我的导航栏HTML：

<div class="flex-container">
    <div class="box1"> 
        <ul id="nav01">
            <li class="dropdown">
                <a href="#" class="dropbtn"># Menu</a>
                    <div class="dropdown-content">
                        <a href="index.html"></a>
                        <a>#</a>
                        <a href="#</a>
                        <a href="#</a>
                        <a href="#</a>
                        <a href="#</a>
                    </div>
            </li>
        </ul>
    </div>
</div>

ul {
  list-style-type: none;
  margin: 0;
  padding: 0.25rem;
  overflow: hidden;
  font-size: 1rem;
  background-color: green;
  border: 3px solid darkgreen;
}

这是我要在体内使用的

<ul class="amazon01">
    <li>#</li>
    <li>#</li>
    <li>#</li>
    <li>#</li>
</ul>

CSS

ul.amazon01 {
    background-color: none;
}

Answer 1

我完全不建议样式化HTML标签。相反，您应该只使用类来进行样式设置。

所以不是

ul {
  ...
}

使用

.nav01 {
  ...
}

如果需要，您可以多次重用您的类，但是通过使用类，您可以完全控制样式的应用位置，而无需覆盖样式。

如果您有多个样式重叠的标签，则可以使用以下语法：

.nav01, .amazon01 {
  styling that is applied for both classes...
}

.nav01 {
  detailed styling... 
}

.amazon01 {
  detailed styling... 
}

如何为一个元素制作多个ID

1 个答案: