CSS List Style with Image

With CSS you can set the list of different markers in both the ordered list (indicated using numbers or letters) or an unordered list (marked using a bullet) and set the image as a marker list. We know it in the HTML tag to set the display <ol> "ordered list", and to set the display <ul> "unordered list". CSS List Style with Image, to arrange for an image used as a list. The value used is the location URL of the image .

CSS code :

<style type="text/css">
ul  {
list-style-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiv75vMAOtkaNpzkL97Z9bFs47feE2e7Y9lM7LvAZgRLxZka-m4H24NnAiKrl3hToG33o5BQyF865C0EYBF_aoWdTaKsFIo5mKyGb9PTsIcjzd50I1cdmULJy5wPKjPypwSBEbdG7ggRhy/s1600/bunga.jpg');}
</style>
<ul>
<li><a href="http://godheg.blogspot.com/search/label/Tips%20and%20Trick">Tips and Trick</a></li>
<li><a href="http://godheg.blogspot.com/search/label/Blogger">Blogger</a></li>
<a href="http://godheg.blogspot.com/search/label/Blogger"> </a>
<li> <a href="http://godheg.blogspot.com/search/label/Wordpress">Wordpress</a></li>
<a href="http://godheg.blogspot.com/search/label/Wordpress"></a></li>
</ul>

Result :

• Tips and Trick
• Blogger
• Wordpress

Note : The red code is the image url