0

タグ内に改行 ( br) が散在するフロー テキストを表示する Web ページがあります。a に続くすべてにインデントを付けspanたいと思います。純粋なCSSでこれを行うことは可能ですか? テキスト自体を操作せずにこれを行うことをお勧めします。(可能ですが、面倒です)タグはタグにあることに注意してください。spanbrbrspan

これは、いくつかのコード例と、純粋な CSS でそれを実行しようとした私の試みです。

.text + br {
  text-indent: 1.5em;
}
.text > br + .text {
  text-indent: 1.5em;
}
<span class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span>
<span class="text">Donec accumsan tortor at maximus vehicula.<br></span>
<span class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span>
<span class="text">Donec accumsan tortor at maximus vehicula.<br></span>

更新: これは、純粋な CSS では実行できない場合があります。私のプロジェクトでは jQuery を使用しているため、jQuery を使用したソリューションは受け入れられます。

更新 2 : text-indentin CSS はブロック要素でのみサポートされます。span タグで使用display: blockするとインデントが機能しますが、不要なブロック要素の改行を防ぐためにコンテンツを span タグ間でマージする必要があります。&nbsp;別の方法として、CSS クラスを設定する代わりに数値を挿入する方法があります。

4

2 に答える 2