Алтай
Делаем анимацию фона (background) на css
Добрый день. Рассмотрим как просто сделать анимированный градиентный фон на чистом css. В этой статье сделаем градиентный фон и при помощи CSS стилей анимируем плавную смену градиента фона. Делаем простую страничку в HTML, примерно так: <head> <link rel="stylesheet" href="styles.css"> </head> <body> <h1>Тест</h1> </body> На этой странице подключена только таблица стилей и в теге body указан заголовок h1. Далее в файле styles.css вставляем такой текст: body { background: linear-gradient(90deg, rgba(132,128,194,1) 0%, rgba(177,177,218,0...
Создание сайтов с нуля - урок 25 - Радиальный градиент на CSS
Стандартное (минимизированное) использование радиального градиента: background: radial-gradient (red, blue). Начальный цвет – в центре градиента, конечный – по краям. Положение центра градиента можно изменить: background: radial-gradient (at 30px 100px, red, blue). При этом, 30 – отступ слева, 100 – слева. Положение центра градиента также можно задавать в процентах или при помощи ключевых слов: top, bottom, left, right, center. Задание размера градиента: background: radial-gradient (red 0px, red 20px, blue 60px, blue 100px). Переходов цветов в градиенте может быть сколько угодно. Форма градиента по умолчанию эллиптическая – ellipse...