Как в :hover сделать инструкцию менять цвет БУКВЫ, а не всего текста?

Question

[Winter525]

я создал бокс, а потом бокс:hover, и сделал color.
Но при этом у меня изменяется весь текст при наводки на букву.
Как можно сделать так, что бы цвет изменялся только той буквы, на которую я навожу?

Answer 1

[Rsa97]

Обернуть каждую букву в отдельный span.

Answer 2

[Noder SS]

Конечно будет весь текст меняется, это же один блок. Оберните каждую букву в span, и задайте стили на Ховер. Либо на js через length

Answer 3

[Сергей Арсентьев]

может что-то такое сработает: https://developer.mozilla.org/ru/docs/Web/CSS/::fi...

<style>
p::first-letter {color: red;}
p:hover::first-letter {color: green;}
</style>

<p>hello</p>

Answer 4

[Артём Буханец]

каждую букву в span