html - CSS 仅在某些页面宽度下显示

Question

发生了一个奇怪的事件，即 CSS 仅在移动 View 、移动浏览器参数期间或当我只是缩小网站时显示。

这是与代码相关的CSS

.right{
    background-color: green;
}
.languages hr{
    border-color:#68c3a3;
    margin-left: 20px;
    margin-right: 20px;
    padding-bottom:5px; margin-bottom:5px; 
}

HTML:

<div class="right">
  <div class="col-sm-3">
    English
  </div>
  <div class="col-lg-9 col-md-8">

    <ul>
      <li class="col-md-3" ><h4>Readng</h4> Good</li>
      <li class="col-md-3" ><h4> Speaking</h4> bad</li>
      <li class="col-md-3"  ><h4>Listening</h4> Terrible</li>
      <li class="col-md-3" ><h4>Understanding</h4> Mehh</li>
    </ul>
  </hr>
  </div>
</div>

如果页面处于最大宽度，标签 .hr 也不会显示。

Answer 1

你应该使用 <hr>不是</hr>只需更改它即可解决您的问题!