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

[@olehyefimenko6693]

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

[@YauhenKavalchuk]

👍

[@SVolikov]

Просто и доступно! Спасибо!

[@YauhenKavalchuk]

Пожалуйста

[@zeleny777leon777]

Женя спасибо тебе!

[@YauhenKavalchuk]

Пожалуйста)

[@АлексейЛоскутников-ю4р]

Спасибо за урок!

[@YauhenKavalchuk]

Пожалуйста

[@danko5678]

Хороший урок

[@YauhenKavalchuk]

Спасибо

[@osnovaplay5911]

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

[@YauhenKavalchuk]

👍

[@deterkot]

хорош

[@АннаПрокофьева-п2ш]

Спасибо👏👏👏

[@YauhenKavalchuk]

Пожалуйста

[@КаухарОморова]

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

[@YauhenKavalchuk]

В видео я показал все возможности и работу

[@HA_CTPIME]

👍👍👍

[@YauhenKavalchuk]

👍

[@kind1y]

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

[@YauhenKavalchuk]

Данный курс уже завершён и доснимать его не планирую. Возможно в будущем обновлю и дополню отдельным новым курсом

[@AiMaster69]

Не понимаю почему так происходит: 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%?

[@ИгорьБатькович-ы9з]

Тоже туго понимаю, но попробуй задай допустим одинаковый процент двум цветам, допустим red 20% blue 20% и синему цвету поднимай процент 21% и тд.. получается от резкого плавный переход от этой точки.

[@AiMaster69]

@@ИгорьБатькович-ы9з Осталось понять причем тут red, если мне нужен градиент из двух цветов, где один из них полностью прозрачен.

[@luchiksolnca6039]

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

[@YauhenKavalchuk]

Без кода трудно понять какой у вас подход(. Но если всё сделано в одном градиенте перечислением, то нет

[@luchiksolnca6039]

@@YauhenKavalchuk спасибо за ответ, я нашел решение использовав :before и border-right

[@nelavas4651]

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

[@YauhenKavalchuk]

Не видя кода и результата трудно чем-то помочь(

[@nelavas4651]

@@YauhenKavalchuk я уже нашёл решение. Вместо: background:linear-gradient(..,..,..); написать: background:linear-gradient(..,..,..) fixed;

[@YauhenKavalchuk]

👍

[@Reto-i2l]

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

[@YauhenKavalchuk]

К сожалению нет, пока не увижу пример вашего кода

[@Reto-i2l]

@@YauhenKavalchuk он выглядит вот так body { background: linear-gradiend(45deg, yellow 25%, black 25%, black 50%, yellow 50%, yellow 75%, black 75%) } Я также пробовал полностью скопировать ваш код добавил wrapper настроил высоту ширину хотя знал что это ничего не изменит

[@Чегеварка]

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

[@YauhenKavalchuk]

Примените градиент только на body и растяните его на 100vh

[@malytv1170]

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

[@ridl27]

все что хочешь можно. вешай и убирай классы при клике.

[@YauhenKavalchuk]

Конечно можно

[@malytv1170]

@@YauhenKavalchuk Сможете сделат подобное видео? На ютубе нет подобного видео. Но многим это интерестно.

[@WolfKrugerr]

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

[@YauhenKavalchuk]

Пару раз потренируетесь на практике и всё будет ок)

[@mouserailway]

про проценты не совсем понятно

[@YauhenKavalchuk]

Процент - это процент фигуры, на которую вы добавляете градиент, который будет заполнен одним цветом

[@user-nc2xw1zb3y]

Что делать если градиент повторяется?

[@YauhenKavalchuk]

Пересмотрите урок, там подробно описана вся работа с градиентами. В том числе и ответ на ваш вопрос

[@user-nc2xw1zb3y]

@@YauhenKavalchuk я пытался выставить background-repeat: no-repeat, но градиент полностью пропадал.

[@olegsky6810]

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

[@YauhenKavalchuk]

Понятия не имеет в чём может быть проблема

[@GANDON229]

тоже