画像を繰り返してラインを引く。

htmlで、画像を繰り返してラインを引く方法。

使う画像

（img/hosi.png）

 完成サンプル

html

<hr class="hosi" />

これにcssで画像を設定します。

css

.hosi{
    border: 0;　/* 枠がついてしまうので0にします。 */
    height: 50px;　/* 画像の高さに合わせました。 */
    background-image: url(img/release_checker/line_hosi.png);
    margin: 20px 0px 20px 0px;
}

完成サンプル

Collection for Girls 大人かわいい素材集(DVD-ROMつき) (玄光社MOOK)