HTML / CSS / jQuery コーディング

【CSS】1文字分のインデント(スペース)を付ける


全角スペースを使ってインデントを付ける方法がありますが、CSSを使った方が後々文字数が増減しても修正の必要がないためおすすめです。

◆HTML

<ul class="textIndent">
<li>※テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</li>
</ul>

◆CSS

.textIndent li {
padding-left: 1em;
text-indent: -1em;
}

<li>タグを増やせば、インデントされた項目を増やすことができます。

サンプルページはこちら

-HTML / CSS / jQuery コーディング
-, ,

© 2025 Web担当屋 ブログ