Caution

お使いのブラウザはJavaScriptが実行できない状態になっております。
当サイトはWebプログラミングの情報サイトの為、
JavaScriptが実行できない環境では正しいコンテンツが提供出来ません。
JavaScriptが実行可能な状態でご閲覧頂くようお願い申し上げます。

CSSプロパティ辞典

  1. トップページ
  2. CSSプロパティ辞典
  3. text-indent

text-indent

テキストの最初の段落のインデント幅を指定します。

サンプルコード
p.test { text-indent: 0;}
p.test1 { text-indent: 10px;}
p.test2 { text-indent: 1em;}
p.test3 { text-indent: 5%;}
p.test4 { text-indent: -10px;}
指定可能な値一覧
値概要
数値数値で指定します。使用できる単位は『px』、『em』、『%』などです。負の数値も指定可能です。初期値は『0』となります。
ブラウザでの表示結果
<p style="text-indent: 0; border: solid 1px black; width: 400px; margin: 0 auto;">ここはp要素です。むかしむかし夫婦者があって、永い間、小児が欲しい、欲しい、といい暮しておりましたが、やっとおかみさんの望みがかなって、神様が願いをきいてくださいました。この夫婦の家の後方には、小さな窓があって、その直ぐ向うに、美しい花や野菜を一面に作った、きれいな庭がみえるが、庭の周囲には高い塀が建廻されているばかりでなく、その持主は、恐ろしい力があって、世間から怖がられている一人の魔女でしたから、誰一人、中へはいろうという者はありませんでした。</p>


<p style="text-indent: 100px; border: solid 1px black; width: 400px; margin: 0 auto;">ここはp要素です。むかしむかし夫婦者があって、永い間、小児が欲しい、欲しい、といい暮しておりましたが、やっとおかみさんの望みがかなって、神様が願いをきいてくださいました。この夫婦の家の後方には、小さな窓があって、その直ぐ向うに、美しい花や野菜を一面に作った、きれいな庭がみえるが、庭の周囲には高い塀が建廻されているばかりでなく、その持主は、恐ろしい力があって、世間から怖がられている一人の魔女でしたから、誰一人、中へはいろうという者はありませんでした。</p>


<p style="text-indent: 1em; border: solid 1px black; width: 400px; margin: 0 auto;">ここはp要素です。むかしむかし夫婦者があって、永い間、小児が欲しい、欲しい、といい暮しておりましたが、やっとおかみさんの望みがかなって、神様が願いをきいてくださいました。この夫婦の家の後方には、小さな窓があって、その直ぐ向うに、美しい花や野菜を一面に作った、きれいな庭がみえるが、庭の周囲には高い塀が建廻されているばかりでなく、その持主は、恐ろしい力があって、世間から怖がられている一人の魔女でしたから、誰一人、中へはいろうという者はありませんでした。</p>


<p style="text-indent: 10%; border: solid 1px black; width: 400px; margin: 0 auto;">ここはp要素です。むかしむかし夫婦者があって、永い間、小児が欲しい、欲しい、といい暮しておりましたが、やっとおかみさんの望みがかなって、神様が願いをきいてくださいました。この夫婦の家の後方には、小さな窓があって、その直ぐ向うに、美しい花や野菜を一面に作った、きれいな庭がみえるが、庭の周囲には高い塀が建廻されているばかりでなく、その持主は、恐ろしい力があって、世間から怖がられている一人の魔女でしたから、誰一人、中へはいろうという者はありませんでした。</p>


<p style="text-indent: -20px; border: solid 1px black; width: 400px; margin: 0 auto;">ここはp要素です。むかしむかし夫婦者があって、永い間、小児が欲しい、欲しい、といい暮しておりましたが、やっとおかみさんの望みがかなって、神様が願いをきいてくださいました。この夫婦の家の後方には、小さな窓があって、その直ぐ向うに、美しい花や野菜を一面に作った、きれいな庭がみえるが、庭の周囲には高い塀が建廻されているばかりでなく、その持主は、恐ろしい力があって、世間から怖がられている一人の魔女でしたから、誰一人、中へはいろうという者はありませんでした。</p>

対応ブラウザ
IE6 IE7 IE8 IE9 IE10 IE11 Safari Chrome Firefox Opera

iPhone Safari Android2系 標準ブラウザ Android4系 標準ブラウザ

概要

テキストの最初の段落のインデント幅を指定します。負の数値も指定可能です。

単位を『%』で指定した場合は自身のコンテンツブロックの横幅を基準とした相対値となります。

記事の間違いや著作権の侵害等ございましたらお手数ですがまでご連絡頂ければ幸いです。

シェア
このエントリーをはてなブックマークに追加