html - 为 hr 标签设置边距的最简单方法是什么？

Question

特别是，我希望设置顶部和底部边距。我尝试了 margin: 10px 0;，但没有成功。我用谷歌搜索了一下，结果要么是过时的，要么是错误的答案。

编辑:代码

html

<div id="new_information_section">
    <div class="tabbable">
        <ul class="nav nav-pills" id="info_nav">
          <li class="active"><a href="#">Admissions</a></li>
          <li><a href="#">The School</a></li>
        </ul>

        <div class="tab-content">
            <div class="tab-pane active" id="tab1">
                <section id="sat_scores">
                    <div class="chunk">
                        <h3>SAT Scores</h3>
                        <ul>
                            <li>Math: 600-690</li>
                            <li>Reading: 570-690</li>
                            <li>Writing: 560-660</li>
                            <li>Composite: 1130-1320</li>
                            <hr />
                            <li>89% submit</li>
                        </ul>
                    </div>

                    <div class="chunk">
                        <canvas id="sat_math" width="200" height="200"></canvas>
                    </div>
                </section> <!-- SAT Scores -->


            </div>

            <div class="tab-pane" id="tab2">
                <p>Howdy, I'm in Section 2.</p>
            </div>
        </div>
    </div>

</div>

CSS

#new_information_section {
    #info_nav {
        margin-top: 50px;
    }
    .chunk {
        display: inline;
        float: left;
        clear: none;
        margin-right: 100px;
    }
    h3 {
        font-family: Verdana;
    }
    ul {
        li {
            margin: 10px 0;
        }
        hr {
            width: 50%;
        }
    }
}

Answer 1

你可以这样做:HTML

                    <ul>
                        <li>Math: 600-690</li>
                        <li>Reading: 570-690</li>
                        <li>Writing: 560-660</li>
                        <li>Composite: 1130-1320</li>
                        <li><hr class="myhrline"/></li>
                        <li>89% submit</li>
                    </ul>

CSS

  hr.myhrline{
     margin: 10px;
  }