css not work enter image description here enter image description here
i hope the .a class first color will be red , but not work .
<style>
.a:first-child {
color: red;
}
</style>
<body>
<ul>
<li>0</li>
<li title="1" class="a">1</li>
<li title="2" class="a">2</li>
<li title="3" class="a">3</li>
<li>4</li>
</ul>
</body>
:first-child pseudo-class only works when your element is the first child of its parent.
Unfortunately, there's no "elegant" way to do what you try to do, i.e. there's no :first-of-class as of yet. See this answer for more details.
So, a bit more code but this is probably the most "elegant" way to do it currently:
<style>
/* Color all "a" class elements with red */
.a {
color: red;
}
/* Make all "a" class elements with default color, except for the first one */
.a ~ .a {
color: inherit;
}
</style>
<body>
<ul>
<li>0</li>
<li title="1" class="a">1</li>
<li title="2" class="a">2</li>
<li title="3" class="a">3</li>
<li>4</li>
</ul>
</body>