【初心者向け】リストのマーカーを変更する方法【CSS サンプルつき】

本文中にリストを入れる方法 について解説しましたが、リストのマーカー（頭に付く記号）の形は、CSS で変更することができます。見本付きで、サンプル CSS を一覧にしてみました。

CSS の編集の簡単な解説は、こちらをごらんください。

- * - * - * - * - * - * - * - * - * - * - * - * - * - * - * - * - * - - * - * - * - * - * -

まずはデフォルト。特に設定をしなければ、disc（黒丸）になるようです。

• リスト1
• リスト2
• リスト3

次に、circle（白丸）です。CSS の編集画面で、以下の記述を追加してください。

ul{
list-style-type:circle;
margin:15px;
}

こんな風になります。

次に、square（四角）です。CSS の編集画面で、以下の記述を追加してください。

ul{
list-style-type: square;
margin:15px;
}

こんな感じになります。

もうひとつ、マーカーを付けない場合です。CSS の編集画面で、以下の記述を追加してください。

ul{
list-style-type: none;
margin:15px;
}

- * - * - * - * - * - * - * - * - * - * - * - * - * - * - * - * - * - - * - * - * - * - * -

これは、CSS の編集が可能なスキンに適用できる方法です。
CSS 編集ができないスキンでも、フリープラグインに記述することで、同じようにマーカーのスタイルを変更することができます。

例：square の場合

<STYLE TYPE="text/css"><!--

ul{
list-style-type:square;
margin:15px;
}

--></STYLE>

<style> ～ </style> までをコピーして、フリープラグインに貼り付けてください。