※(注釈)をつける際はぶら下げインデントを使う

|

例えば、注釈を※をつけて記述するような場合、※マークだけあたかもリストマークのように文章のまとまりからひとつ出ていたほうが、可読性が向上します。text-indentとmargin-leftを組み合わせることにより実現できます。text-indentで※マーク分字上げをし、そうすると全体的に左に1文字分ずれてしまうので、その分margin-leftで位置を右に戻します。

CSSコード

p {
     text-indent: -1em;
     margin-left: 1em;
}

(X)HTMLコード

<p>
※ここは注釈です。ここは注釈です。
</p>

CSSの小技に関する記事(53)

参考サイト

お勧めCSS教本

Powered by Movable Type 4.21-ja

最近のブログ記事