CSS text-indent 文章にインデントを設定する

CSSのtext-indentプロパティで、文章にインデント(字下げ)を設定するサンプルです。

仕様	text-indentプロパティの仕様
サンプル	text-indentのサンプル

text-indentプロパティの仕様

text-indent : 値

text-indentプロパティは、文章のインデント(字下げ)を指定します。

値	説明
数値+単位	指定した単位で設定します。
数値+%	包含ブロックの幅に対する割合です。
値を継承する

適用の対象はブロック要素です。
初期値は0です。
マイナスの値を指定することができます。その場合左にずれます。
以下はMDNのtext-indentプロパティのリンクです。
https://developer.mozilla.org/ja/docs/Web/CSS/text-indent

text-indentのサンプル

text-indentのサンプルです。

<style>
#p1{} /* インデント設定なし */
#p2{text-indent:25px;} /* 25pxで指定 */
#p3{text-indent:-25px;} /* -25pxで指定 */
p{border:1px solid #000;width:250px;height:50px;
margin-bottom:10px;text-indent:10px;background:LightCyan;}
</style>
<p id="p1">インデントなしです</p>
<p id="p2">インデント25pxです</p>
<p id="p3">インデント-25pxです</p>

3行目は、25pxの字下げになります。

以下のイメージになります。