Как на Тильде задать тень товару в карточке, элементу в шейпе — самому объекту, а не его контейнеру
Всем привет😘👋
Не забываем ставить 👍 и подписываемся на канал 🛎 — впереди много интересного🔥🥳
С вами — Наталья Чистякова, UX/UI Веб-дизайнер, в этом видео расскажу о том, как, используя всего CSS-свойство filter и его значение drop-shadow (не путать с box-shadow — в тайминге 07:46 ) присвоить тень самому элементу, а не его контейнеру — товару, а не карточке товара, элементу внутри шейпа, а не самому шейпу и т. д.💪🔥
🦊Желающим задонатить — к боту-помощнику 👉
⏱Тайминг — для вашего удобства❤️:
00:00 — вступление
01:25 — смотрим стандартную настройку тени в зеро
02:20 — присваиваем тень самому объекту внутри контейнера — через CSS filter: drop-shadow(...):
/*не забудьте открывающий (в начале) и закрывающий (в конце) теги style в угловых скобках, Youtube их здесь проставить не даёт*/
.класс_вашего_элемента {
filter: drop-shadow(7px 7px 10px #999999);
}
— первое значение в скобках означает сдвиг по 0X;
— второе — по 0Y;
— третье — blur;
— четвёртое — цвет тени (можно через #, rgb, словом (black, green, crimson и т. п.)
03:54 — проговорили ключевые моменты: картинка в пнг, красоту тени задать в css, прописать код
04:40 — формируем css тени в css генераторе (удобно), ссылка — в Полезных ссылках ниже
06:46 — посмотрели документацию по синтаксису на Developer Mozilla Org
07:46 — коротко — о box-shadow (это — тень контейнера (!))
08:06 — присваиваем тень товару в каталоге товаров в Тильде
14:17 — завершение, приглашаю в чат Pro.дизайн и выражаю готовность отснять материал по вашим темам — предлагайте💋
✔️Полезные ссылки:
📌 Документация, синтаксис и поиграться с drop-shadow 👉
📌 CSS drop-shadow generator (удобный генератор css-кодов красивых теней, один из генераторов) 👉
📌 удалить фон с картинки 👉
📌 плагин Image Downloader (позволяет качать используемые на сайте изображения), Chrome 👉
📹Хочешь предложить свою тему для видео или давай соберём эфир вместе — пиши в ТГ (никнейм: @chistyakova_website) или в комментах к этому видео🔥
Ещё раз напоминаю о том, что это и другие полезные видео выкладываю, в том числе, в рамках нашего дизайнерского душевного чата, в котором являюсь Админом — чат Pro.дизайн 👉
Вливайтесь для человеческого и профессионального общения, а также на случай, если
давно хотели закинуть какую-нибудь интересную тему, но не решались😁 — мы периодически проводим эфиры, так что у вас есть реальный шанс стать приглашённым спикером-экспертом и поделиться своими знаниями, инсайтами и компетенциями с грамотной интеллигентной и просто клёвой аудиторией🔥✨☺️, а потом взять и выложить запись своего бенефиса в соцсетях😉 — отличный инфоповод💪
Если есть вопросы ко мне:
► дизайн;
► типографика и композиция на сайте;
► анимация любого сценария и уровня сложности;
► подбор креативных идей;
► оформление документов для сайта (Политика конфиденциальности, Публичная оферта, РКН, согласие субъекта ПД);
► оформление отношений с заказчиками, разрешение спорных ситуаций, составление актов и претензий);
► любой вопрос за рамками поименованных — мои компетенции гораздо шире заявленных😉,
— пишите в ЛС, разберёмся в любой ситуации🤝
Чат Pro.дизайн 👉
Сообщество в ВК🥰👉
Мой ТГ —
ВК —
Инст (продукт Meta, в РФ признана экстремистской организацией) — /
DProfile —
Приятного просмотра👀🔥
#тени #dropshadow #tilda #тильда
2 views
3034
735
7 months ago 00:11:28 1
Как сделать винтажный ФОНАРИК своими руками из картона. Декор для дома DIY
7 months ago 00:05:51 1
Лимфодренажная зарядка. Как убрать отеки. Лимфодренажная разминка
7 months ago 00:32:38 1
Как нарисовать маки. Уроки рисования. Скетчинг для начинающих.
7 months ago 00:29:16 1
Армения ВЫБРАЛАСЬ из ЛАП КРЕМЛЯ! ВОТ ЭТО МОЩНАЯ ПОЩЕЧИНА РОССИИ | Скальпель
7 months ago 00:11:38 1
Как посадить астильбу Как ухаживать за астильбой
7 months ago 00:12:26 1
Автономное отопление своими руками. Просто, дёшево и без труб.
7 months ago 00:02:50 1
Порча на одиночество . Жизнь как пушечный выстрел-венец безбрачия. ответ экстрасенса Фатимы Хадуевой
7 months ago 00:15:51 1
Судебные страсти. Сбежавшая мать / Crazy Court. Runaway Mother