Warning: Trying to access array offset on value of type bool in /home/yotigory/codingmania.net/public_html/wp-content/plugins/search-everything/config.php on line 29
CSSのtext-indentを使って字下げします - CodingMania

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;
}