Как можно сделать первое слово другим цветом?

Question

[азаза]

В css есть возможность задать псевдоэлемент к первой букве :first-letter дабы изменить свойства, цвет и т.п

Мне нужно сделать каким то образом что бы в заголовке первое слово выделялось другим цветом
ума не приложу как сделать
заголовок заполняется в админке
т.е никакой span добавить нельзя

реально ли как то реализовать такое с css,js ?

Answer 1

[Андрей Федоров]

https://codepen.io/aliencash/pen/vYERJRL

Comments

[азаза]

Благодарю

Answer 2

[Алексей Ярков]

Что-то типа такого

Comments

[Сергей delphinpro]

const header = document.querySelector('H1');
header.innerHTML = header.innerText.split(' ').reduce((h, w, i) => h + (i > 0 ? w : `<span>${w}</span>`) + ' ', '');

[Алексей Ярков]

Сергей delphinpro, и получить в ответ комментарий: А вы не могли бы расшифровать что там написано? =))

Answer 3

[Евгений]

let title = document.querySelector( 'h1' );
title.innerHTML = title.innerHTML.replace( /(\w+)/i, '<span>$&</span>' );