0

Clean and optimized unordered lists for daily use!

Lists are one of fundamentals of html source codes optimization. Here is a quick example for you:

  • List option 1
  • List option 2
  • List option 3

So the html code for such list would be:

<ul>
<li>List option 1</li>
</ul>

Now lets get into css tricks.

=========================

ul {list-style:none; margin:0; padding:0;} /* That would take off the default list styles and create a clean list instance.

ul li {background:url(/img/bullet.gif) no-repeat 0 4px; padding:0 0 0 15px;} /* That would define the image bullet you would like to use for you new list.

Now you shell see your great 1 level unordered list in great shape and look. Next time i am going to demonstrate how to create sub leveled lists and we would overview other types of the list.

Leave a Reply