Question

 .yellow-line{
  position: absolute;
  top: 60px;
  overflow: auto;
  border: 10px bold red;
}

 <img class="vox-logo" src="images/vox_logo.JPG" alt="Vox Logo">
      <div class="header">
        <h5 class="menu-0">EXPLAINERS</h5>
        <h5 class="menu-1">POLITICS AND POLICY</h5>
        <h5 class="menu-2">WORLD</h5>
        <h5 class="menu-3">CULTURE</h5>
        <h5 class="menu-4">SCIENCE AND HEALTH</h5>
        <h5 class="menu-5">IDENTITIES</h5>
        <h5 class="menu-6">MORE</h5>
        <img class="twitter" src="images/twitter.png" alt="Twitter">
        <img class="facebook" src="images/facebook.png" alt="Facebook">
        <img class="youtube" src="images/youtube.png" alt="YouTube">
        <img class="rss" src="images/rss.png" alt="RSS">
        <img class="people" src="images/people.png" alt="People">
        <img class="search" src="images/search.png" alt="Search">
      </div>
      <br>
      <hr/>
      <div>
        <hr class="yellow-line">
      </div>

我不能在div之后添加一行。请检查上面给出的代码。

请帮我解决这个问题，因为我正在努力寻找解决方案。谢谢。

Answer 1

首先，你的语法错了。它应该是border-top: 10px solid red; 并且无需将位置绝对和溢出自动赋予hr标记。

试试这个：border-top: 10px solid red;

Answer 2

您的border语法错误，没有任何名为bold使用solid或任何其他选项的内容。 position不是必需的，但如果您仍然需要它。

请指定元素的宽度，如下所示。或者给它的父position: relative以便它可以放在父母中。

＆＃13;

 .yellow-line{
  position: absolute;
  top: 60px;
  overflow: auto;
  width: 100%;
  border: 10px solid red;
  margin-bottom: 10px;
}

＆＃13;

 <img class="vox-logo" src="images/vox_logo.JPG" alt="Vox Logo">
      <div class="header">
        <h5 class="menu-0">EXPLAINERS</h5>
        <h5 class="menu-1">POLITICS AND POLICY</h5>
        <h5 class="menu-2">WORLD</h5>
        <h5 class="menu-3">CULTURE</h5>
        <h5 class="menu-4">SCIENCE AND HEALTH</h5>
        <h5 class="menu-5">IDENTITIES</h5>
        <h5 class="menu-6">MORE</h5>
        <img class="twitter" src="images/twitter.png" alt="Twitter">
        <img class="facebook" src="images/facebook.png" alt="Facebook">
        <img class="youtube" src="images/youtube.png" alt="YouTube">
        <img class="rss" src="images/rss.png" alt="RSS">
        <img class="people" src="images/people.png" alt="People">
        <img class="search" src="images/search.png" alt="Search">
      </div>
      <br>
      <hr/>
      <div style="position:relative;">
        <hr class="yellow-line">
      </div>

＆＃13;

我无法使用HTML中的<hr />标记添加一行

2 个答案: