[html/css]liタグの黒点を消す方法

liタグをデフォルメ状態で使用すると黒点をつきますが今回はそれを消す方法を紹介します。

liの黒点を消す

See the Pen html2黒点を消すpart1 by コココット (@cococodog) on CodePen.

cssで何も記述しないと上記のように黒点が付けられます。

黒点を消す方法としてulもしくはli部分にlist-style-type: none;を書く方法が挙げられます。

ul

See the Pen Untitled by コココット (@cococodog) on CodePen.

li

See the Pen html2黒点を消すpart3 by コココット (@cococodog) on CodePen.

ul部分に書こうがli部分に書こうが何も変わらないと思いますが、ul部分に書いたほうが個人的にはみやすいと思います。

また黒点を消した場合黒点部分にpaddingで空白ができるので消しておきましょう。

比較用

See the Pen html2黒点を消すpart4 by コココット (@cococodog) on CodePen.