行頭記号やリストマークなどの装飾を、画像なしで実現する方法で普段よく使うものをリストアップしてみました。 今回は、 先頭に何かしら装飾をつける 2行目以降の先頭を1行目と揃える 以上の2点をリストアップの条件にしました。 サンプルはこちらです。 sample1 装飾文字を直接記述(全角のみ対応) サンプルはこちら まずはシンプルに、直接HTML上で行頭に「※」を挿入する方法。 2行目以降の先頭が1行目と揃うように、text-indentで「※」の1字分下げてやります。 そのままだと行の先頭が1字分左に寄ってしまうので、その分左マージンを取って調整します。 p { text-indent: -1em; margin-left: 1em; } ※ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト sample2 装飾文字を直接記述(全角・半角どち
![画像なしで表現するリストマークのサンプルいろいろ | Tips Note by TAM](https://cdn-ak-scissors.b.st-hatena.com/image/square/c0808a46a6d15f4beb95cc6e201f12bd76d8f4cc/height=288;version=1;width=512/https%3A%2F%2Fwww.tam-tam.co.jp%2Ftipsnote%2Fwpdata%2Fwp-content%2Fuploads%2F2014%2F04%2Fhtml-1024x538.png)