【CSS】2行目以降を1文字下げる［text-indent］の使い方。

箇条書きや注意書きの文章を書く場合に、文章の先頭に「・」や「※」などの記号を記述することがよくあると思います。 しかし、2行目以降がその記号の下に回り込んでしまうことが気になっている方も多いのではないでしょうか。 手作業で地道に改行を入れたり、記号を画像で背景設定したり、あるいは強制的にリスト化してマークをつけたりと、あの手この手で誤摩化しているケースはよくあります。 でも「やっぱりテキストで綺麗に表示させたい！」というときに、以下の方法が最適です。 まずはサンプルをご覧ください。 ※text-indentプロパティの便利な使い方。：サンプルページ どうでしょう？ 見事なまでに文章の先頭が綺麗に揃っていますね。 設定の仕方は以下の通りです。 HTML HTMLでの記述。 <p class="indent-1">※text-indentプロパティの便利な使い方。<br> 文章の段落などの2行

[h-battlexxofxxanny]

“p.indent-1 { padding-left:1em; text-indent:-1em; }”

[yayocan]

indent