HTMLタグ/CSS一覧と初心者向けホームページ作成解説集:HTMLタグボード

HTMLタグボードのトップへ戻る ゼロから始めるホームページ作成講座 訪問者優位のWEBデザインTips インターネットで小遣い稼ぎ 今すぐ使える!便利ツール(HTMLタグ辞典など)


文字下げ(インデント)を行う

CSSの書き方

text-indent:値 ;

CSSの詳細情報
プロパティ名 text-indent 読み方 テキスト・インデント
初期値 0 意味 文字下げ調整
サイズ/パーセント指定
対象 ブロックレベル要素
CSSレベル CSSレベル1 対応ブラウザ Windows MAC
継承 する IE 5.0以上/FF1.0/NS7.1/OP8.0 SF/IE5.0

解説

段落の文頭の文字下げを設定するスタイルシートです。値に「10px」などのサイズや「80%」などのパーセントを指定すると、指定したブロックレベル要素の文頭の文字列がインデント(文字下げ)されます。

パーセントは相対的な指定になりますが、この場合は「text-indent」プロパティの親にあたる親要素の横幅が基準となります。

一部のInternetExplorerで不具合あり

InternetExplorer6.0以降の互換モードおよび5.5以前のバージョンでは、パーセントによる指定の際の基準長さが、親要素の幅ではなく、「text-indent」プロパティを設定したブロックレベル要素の幅となる点で不具合があります。

CSS/HTMLサンプル

p { text-indent:1em; background:#ffdff9; }

段落の文字下げを1文字分に設定 サンプル