• Теория
  • Теория

Пропорции цветов и колорстопы

По умолчанию цвета в градиентах распределяются равномерно, в одинаковых пропорциях, но этим поведением можно управлять.

Делается это с помощью так называемых колорстопов, которые записываются сразу после значений цветов, например, red 0%, yellow 100%.

Колорстоп указывает положение цвета в градиенте, его можно задавать в процентах, пикселях и других единицах. Давайте рассмотрим несколько примеров, чтобы понять поведение колорстопов:

yellow, green
yellow 0%, green 100%
yellow 0%, green 50%
yellow 50%, green 100%
yellow 25%, green 75%
red, yellow, green
red 0%, yellow 50%, green 100%
red 33%, yellow 66%, green 100%

Колорстоп задаёт то место, где будет располагаться центральная (самая насыщенная) часть цвета.

Минимальный вид табов
  • index.html
HTML
HTML

Вы перешли на другую страницу

Кликните внутри мини-браузера, чтобы поставить фокус в это окно.

100%
Бабушка Кекс

Притормози, дружище

Проходить вызовы части «Линейные градиенты» тренажёра «Погружение в декоративные эффекты» можно после регистрации и оформления подписки.

Зарегистрироваться