ul要素で箇条書きリストを書くと、自動的に黒ポチがつきますよね。この点の色を変えて、「リストをちょっと華やかにしたい!」なんて時もあるはずです。 しかし、ul要素やli要素に文字色を指定すると、リストのテキストも色が変わってしまうので、困っている人もいるのではないでしょうか。 もちろん、点だけ色を変える方法はあります。 そのやり方を紹介しますね。 ul要素の黒ポチだけ色を変える一番かんたんな方法 一番手っ取り早い方法は、liの中のテキストをspan要素でかこんでしまうことです。 HTML <ul> <li><span>牛乳</span></li> <li><span>小麦粉</span></li> <li><span>塩</span></li> </ul> CSS li{ color: #4dd2ff; } li span { color: #222222; } li要素に黒ポチにつけたい
![【CSS】箇条書きリスト(ul要素)の点の色を変える【疑似要素を使った方法がおすすめ】](https://cdn-ak-scissors.b.st-hatena.com/image/square/06778960f083d6f8f48770df11dc1f9916627687/height=288;version=1;width=512/https%3A%2F%2Fnamagomi-days.com%2Fwp%2Fwp-content%2Fuploads%2F2019%2F01%2Ful-color.png)