2012/3/25

CSSのtext-indentを使って字下げします

リストにインデント(一文字分下げる)をつけることができます。

一文字分を1emとしていますが、文字によっては調整が必要です。

HTMl

<ul class="ex_listindent1">
<li>※文章が続きます。</li>
<li>※文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 <br />改行しました。</li>
<li>※文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 文章が続きます。 </li>
</ul>

CSS

.ex_listindent1 li{
	text-indent:-1em;
	padding:0 0 0 1em;
}