CSS3 #15 Градиенты (Gradients)

preview_player
Показать описание
#YauhenK #webDev #CSS #CSS3

Всех приветствую в курсе «CSS3».
В данном видеокурсе мы с вами рассмотрим CSS, или каскадных таблиц стилей. Начнём с основ: простые и составные селектора, псевдоклассы и псевдоэлементы, позиционирование, блочная модель и т.д. А так же разберём свойства добавленные в третьей версии спецификации: границы и скругления, тени, градиенты, фильтры, трансформации, анимации, плавные переходы и т.д. По окончанию курса вы получите отличную теоретическую базу для создания полноценных статичных веб-страниц.

✒ Репозиторий курса:

✒ Полный список готовых и планируемых курсов:

✒ Автор курса:

Рекомендации по теме
Комментарии
Автор

Спасибо за курс и проделанную тобой работу! Благодаря твоим курсам узнал много нового! Ну а с моей стороны - лайк, подписка, комментарий!

olehyefimenko
Автор

Почему в конце у вас стал резким, можно градиент сделать более плавным как вы сделали в начале?или это не работает?

КаухарОморова
Автор

Круто) А по mask-image тоже можно урок?)
Для мобильников хочу сделать затемнение по бокам для хлебных крошек, чтобы видно было, что их можно скроллить.
В инете нашёл только для правого края mask-image: linear-gradient(to right, white 90%, transparent).
Подскажите плз, а как можно сделать одновременно и для левого? Если писать через запятую градиенты сначала to left и потом to right, то перестаёт работать :(

kindy
Автор

Мне 10 лет а занимаюсь уже где-то 2 месяца прошел полный курс по HTML5 теперь CSS. Уже создавал сайт по типу кинокрада

osnovaplay
Автор

У меня возникает проблема. Когда я делаю линейный гиадиент сверху вниз, то у меня фон полностью пропадает или становится градиентом на короткие дистанции, т.е на сайте градиент не один, а много коротких😢

nelavas
Автор

Добрый день! Можно ли скрыт элемент css и открыть её после события onclick на button в js. Например поле с характеристиками товара или что-то подобное.

malytv
Автор

Не понимаю почему так происходит:
background-image: linear-gradient(to left, transparent 51%, blue 49%);
background-image: linear-gradient(to left, transparent 50%, blue 50%);
background-image: linear-gradient(to left, transparent 49%, blue 51%);
Почему после 50% градиент становится плавным, а до резким. Как сохранить резкий переход после 50%?

AiMaster
Автор

А почему если применить линейный градиент к html или к body появляются горизонтальные полосы в которых и формируется градиент, а не на весь экран ?

Чегеварка
Автор

Каждый раз когда я добавляю более 3 цветов у меня ничего не выходит вы можете сказать в чём дело(

Reto-il
Автор

Привет всем! Делаю градиент клетка с полями, как школьная тетрадь. У меня возникли трудности. Можно сделать как то, чтобы background-size не применялся к одному из слоев linear-gradient.

luchiksolnca
Автор

4:30 сложновато для понимания с непривычки.

WolfKrugerr
Автор

прошу прощения - код не зачеркнут, но на экране нет градиента

olegsky
join shbcf.ru