Changing colours of links in a list


#1


https://www.codecademy.com/en/courses/web-beginner-en-WF0CF/3/5?curriculum_id=50579fb998b470000202dc8b#


I want the fist link and the third to be different colours, and I get that all the "a" tags are first children of their "li" tags, but how do I code this correctly in the CSS tab


index.html:
<h2 style=font-family:"Tahoma"> News Sources</h2>
		<ul>
	            <li><a href="http://www.huffingtonpost.ca">Huffington Post</a></li>
		    <li><a href="https://theintercept.com">The Intercept</a></li>
		    <li><a href="http://www.aljazeera.com">Aljazeera</a></li>
		</ul>
stylesheet.css:
a:hover{
    text-decoration:none;
}
a:first-child {
    color:#CDBE70;
}
a:nth-child(3){
    color:#FFC125;
}


#3

Since the anchors directly correspond to a list item parent, and the parents are all siblings, we may write,

li:first-child a {}

li:nth-child(3) a {}

#4

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.