例えば↓みたいに文章の左右に横線を付けるとします。
こんな時はcss擬似要素の「before」と「after」を使えばできます。
ちなみに「bofore」は要素の直前に表示したい内容を追加することができて「after」は要素の直後に表示したい内容を追加することができます。
「テキストテキスト」の左右に線をつけるためのコードは↓です。
「テキストテキスト」の左側に付けたい内容をbeforeで書いて「テキストテキスト」の右側に付けたい内容をafterで書きます。
「テキストテキスト」の左にある線のコードは8行目〜12行目で「テキストテキスト」の右にある線のコードは13行目〜17行目です。
11行目と16行目のwidthがないと長さが無くて線が表示されないので必ずつけてください。
また19行目のdisplay:flexがないと横並びにすることができないので必ずつけてください。
「テキストテキスト」の左右に線ではなく文字を並べるとします。
その時はcontent:’ ‘とするのではなくcontent:’並べたい文字’としてください。
具体的なコードは↓になります。
これで↓になります。
●いいねをつけてもらえると励みになります。