#css #dynamic #colors
#css #динамический #Цвет
Вопрос:
Хорошо, я признаю, что заголовок кажется немного загадочным, но вот ситуация:
У меня есть список участников на странице с фотографиями и кратким биографическим описанием, каждый из которых является собственным <div>. Допустим, у меня на странице семь действующих лиц, и я хочу, чтобы цвета текста в их полях менялись, скажем, чтобы создать радугу, поэтому актер 1 был бы красным, 2 — оранжевым, 3 — желтым и так далее. Могу ли я сделать это без необходимости вручную указывать style=»color: rgb (что угодно)» в каждом div? Допустим, я хочу, чтобы значения цвета изменялись динамически, если я добавляю больше людей в список или убираю их, поэтому я бы указал начальное значение цвета rgb (255,0,0) для красного и конечное значение rgb (255,0,255) для фиолетового и каким-то образом заполнил остальное, так что каждое последующее поле имеет другой цвет текста, но все вместе они образуют радугу.
… или я был бы вынужден использовать JavaScript для этого?
Комментарии:
1. Большую часть пути вы пройдете с новыми
nth-childселекторами.2. @ralph.m как именно вы бы этого добились
nth-child? Как бы вы указали динамическое приращение «синего» элемента в цветовой схеме RGB? HTML6?3. вы можете использовать LESS или SCSS для этой операции, поэтому вам не нужно каждый раз выполнять это вручную, или, если вы хотите полностью динамичный, вам нужно использовать JavaScript или jquery.
Ответ №1:
Нет, вам не обязательно вручную выделять красный цвет, вы можете использовать CSS-селекторы n-го дочернего элемента, пожалуйста, ознакомьтесь с приведенным ниже руководством
Нажмите здесь!
Комментарии:
1. Я не говорю, что ссылка бесполезна, но, пожалуйста, не публикуйте ответы только по ссылке, потому что они потеряют свою ценность, если связанная страница станет недоступной. Вместо этого добавьте хотя бы пример кода к своему ответу.
2. Спасибо, что предложили мне, в следующий раз я обязательно добавлю пример кода 🙂