W3 Mind Logo
Home » Coloring Bullets & Numbers – CSS3

Coloring Bullets & Numbers – CSS3

				
					ul{
    list-style: none
  }

li{
    position: relative
  }

li::before{
    content: '';
    background: orange;
	position: absolute;
    top: 18px;
    left:0;
    width: 7px;
	height: 7px;    
    border-radius: 100%;
	-o-border-radius: 100%;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	-ms-border-radius: 100%	
  }
				
			

Example:

  • List Item 01
  • List Item 02
  • List Item 03
				
					ol {
    list-style: none;
	counter-reset: li
}
ol li {
	counter-increment: li
}
ol li:before {
	content: counter(li);
	color: orange
}
				
			

Example:

  1. List Item 01
  2. List Item 02
  3. List Item 03
About Author
W3Mind

W3Mind

W3Mind focuses on Blogging, Make Money Online, SEO, Business Blogging, Social Media, WordPress, Internet Tools, Web Design and Development.
Give it a Share
Facebook
Twitter
LinkedIn
You May Also Like
Leave a Reply

Your email address will not be published. Required fields are marked *

How to
START A
BLOG
(step by step)
Load WordPress Sites in as fast as 37ms!