Did CSS has second-letter pseudo element

Question

I'm using a CSS style for a letter to change a color of a first second third letter.

like this:

.header .logo h1 > a:first-letter {
  color: #f91ea5;
}

but I don't know how to change a color of second and third letter it's don't have a second-letter element.

Solution 1

I think, you cannot use pseudo elements as :second-letter or :third-letter. It's by design. But if it's realy necessary, then use JavaScript, for example: this or this.

Solution 2

No, there is no selector for second or third letter, in Selectors Level 3 or even as planned in the Selectors Level 4 draft. (If there even will be such selectors, they will most probably follow the patter of :nth-child(...).)

What you can do is to wrap the letters in text-level containers, e.g.

<a ...>A<span class=second>C</span><span class=third>M</span>E</a>

Then you can use normal class selectors like .second.