Identifly list item for css usage?

Question

see, i build my own website using just html and css. I'm figuring out most things on my own but i can't find a way to solve this problem, i guess because of my limited knowledge. I have this simple list:

<ul class="nav">  

  <li><a href="#">HOME</a></li>

  <li><a href="#">GALLERY</a></li>

  <li><a href="maps.html">PARKING</a></li>

  <li><a href="#">DOGS</a></li>

  <li><a href="#">ABOUT</a></li>  

</ul>

I now want to change the appearance of the third item when it is clicked, therefore i somehow need to identify it, so i can stylize it like below:

.nav > li > a {

text-decoration:none;

font-size: 20px;

color: #ffffff;

}

Like in this example above, i want to stylize the appearance, but not for all items, just for one.
Can you help me out? Sorry if i wasn't clear enough..

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

Answer 1

I'd add a class to it and style based on that. No reason to get super specific with selectors here.

<li><a href="maps.html" class="parking">Parking</a></li>

Then in your CSS you can do:

.parking:active {
  ...
}

Identifly list item for css usage?

Sign up