[解決済み] 水平線とその正しい記述方法（html, css

質問

あるブロックの後に水平線を引く必要があるのですが、3つの方法があります。

1) クラスを定義する h_line というように、CSSの機能を追加します。

#css
.hline { width:100%; height:1px; background: #fff }

#html
<div class="block_1">Lorem</div> <div class="h_line"></div>

2）使用する hr タグ

#css
hr { width:100%; height:1px; background: #fff }

#html
<div class="block_1">Lorem</div> <hr />

3) のように使用します。 after 擬似クラス

#css
.hline:after { width:100%; height:1px; background: #fff; content:"" }

#html
<div class="block_1 h_line">Lorem</div>

どの方法が一番実用的ですか？

どのように解決するのですか？

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

<div>Hello</div>
<hr/>
<div>World</div>

以下は、その方法です。 html5boilerplate がそれを行います。

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}