如何坚持使用 CSS 阻止

Question

您好，我在 HTML/CSS 中有一个非常简单的代码，我只想将名为 header1 的第一个块粘贴为蓝色，将 header2 粘贴为红色。我希望这两个块之间没有空白。

这是代码：

/* style22.css */


/* Définition des caractéristiques globales */

body {
  background-color: #FFF;
  font-weight: 400;
}

a {
  text-decoration: none;
  / color: #FFF;
}


/* Header */

#conteneur {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.header1 {
  background: blue;
}


/* Navigation */

nav ul {
  list-style-type: none;
  display: flex;
  background: red;
}

<header id="conteneur">

  <div class="header1">
    <div><a href="how.html"><span class="logo">ALGOBETTER</span></a></div>
  </div>

  <nav class="header2">
    <ul>
      <li><a href="gold_rules.html">Règles d'or</a></li>
      <li><a href="pronos.html">Pronostics</a></li>
    </ul>
  </nav>
</header>

也许你可以帮忙。谢谢

Answer 1

添加margin: 0;到 ul（默认情况下，无序列表的边距不同于 0）：

a {
  text-decoration: none;
}


/* Header */

#conteneur {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.header1 {
  background: blue;
}


/* Navigation */

nav ul {
  list-style-type: none;
  display: flex;
  background: red;
  margin: 0;
}

<div class="header1">
  <div><a href="how.html"><span class="logo">ALGOBETTER</span></a></div>
</div>

<nav class="header2">
  <ul>
    <li><a href="gold_rules.html">Règles d'or</a></li>
    <li><a href="pronos.html">Pronostics</a></li>
  </ul>
</nav>