PDA

View Full Version : CSS navigation - using different tab images?



inspired78
Jul 27th, 2010, 11:32 PM
Hello!

How do you create a navigation menu with different tab images?

I have created a navigation menu using HTML lists and CSS styling. However, my client has given me six personally designed tabs (all have the same shape but they have different text on it).

I know how to develop a navigaton menu using this css code: 'background: url(images/image_name.png)'

However, how do I implement the same navigation menu but with six differently designed tabs??

optimus203
Jul 28th, 2010, 12:28 AM
Please post some of your code so we can help. The question is kind of vague right now.

My first response would be to add class names to each <li>, then assign background image to each different class. For example;



.link1 {
background: url(images/image1.png) no-repeat;
}
.link2 {
background: url(images/image2.png) no-repeat;
}

<ul>
<li class="link1">Link 1</li>
<li class="link2">Link 2</li>
</ul>