我的 div 的背景颜色不起作用[关闭]答案

【问题标题】：My background color for my div is not working [closed]我的 div 的背景颜色不起作用[关闭]
【发布时间】：2021-12-21 11:40:48
【问题描述】：

我想让我的元素有背景 #22223b，但我的代码不起作用。

.nav {
  background-color: #22223b;
}

<div class="header">
  <div class="nav">
    <ul>
      <li> <a href="index.html">Home</a> </li>
      <li> <a href="#">About Us</a> </li>
      <li> <a href="#">Start Learning</a> </li>
    </ul>
  </div>

  <div class="account">
    <ul>
      <li> <a href="#">Profile</a> </li>
      <li> <a href="#">Portal</a> </li>
    </ul>
  </div>

【问题讨论】：

根据您所写的内容，这应该可行；）
我看到了.nav 的背景。什么不工作？这个 CSS 是否在同一个文件中，如果是外部文件，你是否将它包含在你的页面中？
始终添加所需的最少代码量，以便我们可以在问题本身中重现您的问题，而不是在外部页面上。您在此处显示的代码按预期工作，没有任何问题。

标签： html css background-color

【解决方案1】：

背景颜色应该是可见的，如果不可见，则链接 css 文件可能存在问题。

我在 <style> 中添加了样式，因此无需 css 文件即可应用样式。

<div class="nav">
  <ul>
    <li> <a href="index.html">Home</a> </li>
    <li> <a href="#">About Us</a> </li>
    <li> <a href="#">Start Learning</a> </li>
  </ul>
</div>
<div class="account">
  <ul>
    <li> <a href="#">Profile</a> </li>
    <li> <a href="#">Portal</a> </li>
  </ul>
</div>

<style>
  .nav {
    background-color: #22223b;
  }
</style>

【讨论】：

我这样做了，但它不起作用？你认为我可以将你添加到我的 repl 中吗？
当然！我可以快速浏览一下！
完成！当元素有 float: left 时，父 div (.nav) 没有高度，这意味着背景颜色无法显示。 replit.com/@TahaParacha1/Summit#style.css
太棒了！非常感谢：D