横棒を一本だけ引く方法は、HTMLを使う方法とCSSを使う方法があります。
hrタグを使う
HTML の
https://developer.mozilla.org/ja/docs/Web/HTML/Element/hr<hr>
要素は、段落レベルの要素間において、テーマの意味的な区切りを表します。例えば、話の場面の切り替えや、節内での話題の転換などです。
こちらは、HTMLのタグで水平線を引くため、ただデザイン目的で線を引くのではなく、意味的に区切る際に使います。
CSSで引く
<div class="hr"></div>
.hr {
border: 4px solid red;
width: '100%',
}
デザインとして、水平線を引くなら、上記のように記述することで水平線を引けます。空の要素をつくるのが嫌であれば、疑似要素を使用してください。
注意点としては、表示される線は枠線の上下がくっついているので、4pxと指定すると、上下合わせて8pxの高さの水平線が表示されることです。
コメント