そのため、<hr>タグや<div>タグを活用することで、かんたんに区切り線・仕切り線をつけることができます。
この記事では、コピペで使える区切り線のデザイン・使い方についてまとめます。
BloggerのHTMLモードの使い方・区切り線の基本的な使い方については、こちらの記事をご覧ください。
>>【Blogger】記事中に区切り線・仕切り線を引く方法
シンプルな区切り線
シンプルな区切り線です。
この記事では見やすいように、区切り線を短く表示しています。
ソースコード：
<hr/>
ドット付きの区切り線
<hr/>タグと違い、<div>タグにCSSでつけています。
ソースコード：
<div style="border-bottom: 1px dashed #888;"/>
少し太め
これを区切り線に使用することで、存在感がでます。
ソースコード：
<div style="border-bottom: 3px solid #888;"/>
二重の線
二重の区切り線です。
二重の場合、上の線と下の線、間の間隔の合計がpxとなります。
ソースコード：
<div style="border-bottom: 3px double #888;"/>
色つきの線
区切り線に色をつけて見ましょう。
#888の部分を好きなカラーコードに変えればOKです。
ソースコード：
<div style="border-bottom: 1px solid #ff8000;"/>
まとめ
お気に入りのスタイルはみつかりましたか？はじめは覚えられず大変かもしれませんが、慣れるとかんたんなので、どんどん活用しましょう！
よろしければ、こちらの記事も合わせてごらんください。
>>【Blogger】記事中に区切り線・仕切り線を引く方法
コメント