Как раскрасить каждое слово заголовка?

222
21 марта 2018, 03:24

Как раскрасить каждое слово заголовка h2 в разный цвет с помощью css?

Answer 1

Через css только если каждое слово обернуто в тэг

Answer 2

Можно сделать с помощью такого простого JavaScript-а.

var colors = ["red", "blue", "green", "orange", "olive"]; 
var el = document.getElementById("h") 
var arr = el.innerText.split(" "); 
var str = ""; 
var i = 0; 
 
for (var word of arr) { 
  str += ` <span style="color:${colors[i++ % colors.length]}">${word}</span>`; 
} 
 
el.innerHTML = str;
<h2 id="h">Всем привет, с вами говорит рыжий кот!</h2>

READ ALSO
Как сделать border для маркера?

Как сделать border для маркера?

В списке под каждым li стоит border-bottom, но он не распространяется на маркерМожно ли как то подчеркнуть li вместе с маркером?

203
Как сверстать две колонки на CSS

Как сверстать две колонки на CSS

Как сделать такое на CSS? мне приходит только table использовать, но мне кажется это не лучшая идея

228
Анимация на кнопке,помощь

Анимация на кнопке,помощь

http://akar-grouppcom/ Анимация есть на всех кнопках, пульсация постоянная прозрачная

256
Косяк с полосой

Косяк с полосой

Рылся-рылся в стилях, ничего не получаетсяДобавьте 2 товара в корзину, именно 2 товара и перейдите в саму корзину в моб

185