html – Selecting markers (bullets, numbering etc) of a specific list using CSS

I have the following code1 in which the ::marker psudeo-element is used to style the markers of the lists (i.e. bullets and numbering). However, it selects the markers of all the lists that are used in the html document:

<!DOCTYPE html>
::marker { 
  color: blue;
  font-size: 23px;




I only want to style the markers of the unordered list <ul>, so I changed the CSS code of the pseudo-element to:

ul::marker { 
color: blue;
font-size: 23px;

But when I run this code, the style doesn’t apply to any list and gives me a simple output without any styles. How do I fix this?

1. The code has been taken from W3Schools

Source link

Latest articles

Related articles

Leave a reply

Please enter your comment!
Please enter your name here