0

我有一个关于 hr 标签的问题。我的 html 下面有两个小时是用 CSS 边框装饰的。当我运行代码时，第一个会按我的意图显示，而第二个不会，即使它们共享相同的 CSS。我应该怎么做？？？

这是我的代码：

hr {
  border: none;
  border-top: 5px dotted #EAF6F6;
  width: 5%;
  margin-top: 50px;
  margin-bottom: 50px;
}
<div class="middle-container">
    <div class="profile">
      <img src="resources/profile.png" alt="peofile-picture">
      <h2>Hello.</h2>
      <p>Learning web development skills. Just a drunk girl who's longing for Britain.</p>
    </div>
    <hr>

    <div class="skills">
      <h2>My Skills.</h2>
      <div class="skill-row">
        <img src="resources/coding.png" class="code-img" alt="coding">
        <h3>WEB designing</h3>
        <p>Please remember, I AM really a NEWBIE when it comes to designing the website.</p>
      </div>
      <div class="skill-row">
        <img src="resources/beer.png" class="beer-img" alt="beer">
        <h3>Drinking. Yes, JUST a drinking.</h3>
        <p class="drink">Having good meal is pleasure. When it comes with good drink, that's far more better.</p>
      </div>
    </div>

    <hr>

    <div class="contact-me">
      <h2>Get In Touch</h2>
      <h3>But if you're interested in me...</h3>
      <p>Please feel free to contact, there might be any help I can provide.</p>
      <a class="btn" href="mailto:fictional@gmail.com">CONTACT ME</a>
    </div>
  </div>

4

1 回答 1

-1

我认为您在 HTML 中忘记了一个hr，只需查看下面的图片即可了解：

在此处输入图像描述

于 2021-09-01T13:46:39.187 回答