Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to set ul/li bullet point color? [duplicate]

Tags:

Possible Duplicate:
Change bullets color in a list without span

Normally, the bullet point in ul/li is a black solid circle. I want to change the style of it, like I want to set the color of the bullet point to be green, I also want to change the bullet point to be a square. Anyone knows how to do that?

like image 485
Steven Zack Avatar asked Aug 15 '11 18:08

Steven Zack


People also ask

How do I change the color of a bullet in UL?

Note: We cannot change the color of the bullet of the unordered list by default but we can take the help of some other tags and selectors. There are two ways to change the color of the bullet: Using an extra markup tag. Using Css style ::before selector.

How do I change the color of a bullet in constant contact?

You will have to click on the Design tab located on the left side of the screen when you are editing your campaign. Once you click on that tab you will want to scroll a little bit down until you see a section that says "Fonts". Then, you will click on the "A" that has a color bar underneath it and select a new color.

How do you change the bullet image on ul li?

To change the bullet to an image, we will add two new CSS classes one for the <ul> element the other one for the <li> element. For the list class, we will set the padding and the margin to "0" and set the list-style-type to none.


Video Answer


1 Answers

Apply the color to the li and set the span (or other child element) color to whatever color the text should be.

ul {     list-style-type: square; }  ul > li {     color: green; }  ul > li > span {     color: black; } 

JSFiddle

like image 104
Evan Mulawski Avatar answered Oct 14 '22 21:10

Evan Mulawski