MoreLesson 258Free preview
Bullet Color
This lesson is part of How To · All levels
Summary
The color of the bullet on the list can be set by using a pseudo-element::marker or by making a custom bullet using a::before.::marker is a modern simple way to change the color and some of the properties of the marker. For full control of shape and position, remove the built-in marker and then the image itself with the pseudo-element.
Key points
- The markers allow for color and font changes on the list markers.
- List-style-type: none deletes the built-in marker.
- ::before on <li> can create custom bullet with free shape and color.
- Put the padding away so the bullet doesn't stick to the text.
Full lesson
Code examples and quizzes
Full lessons, code examples, and quizzes are available to subscribers. 5 questions.