Inside the body of my site is this code:
Here is the HTML:
<ul id="navlist">
<li class="first">
<a href="/" id="current">Home</a>
</li>
<li>
<a href="/Store/">Store</a>
</li>
</ul>
Accompanied by this CSS styling:
ul#navlist
{
float: right;
}
ul#navlist li
{
display: inline;
}
ul#navlist li a
{
border-left: 1px dotted #8A8575;
padding: 10px;
margin-top: 10px;
color: #8A8575;
text-decoration: none;
float: left;
}
ul#navlist li:first-child a
{
border: none;
}
ul#navlist li a:hover
{
color: #F6855E;
}
I am trying to comprehend the meaning and syntax of the following:
ul#navlist li:first-child a
componentClass#class componentClass:class(???) componentClass
What exactly does first-child
signify? Is there also a second child
modifier available? Do these CSS blocks function as logical alternatives?