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

258

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>

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

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

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

228

CSS

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

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

268

CSS

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

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

293

CSS

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

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

217