ВідеоIT та програмуванняв індексі з
Каскадні шари CSS через рік: чи варто ділити стилі по Mobile First / Desktop First?
500 переглядів на YouTube · опубліковано
CSS Cascade Layers через рік: як люди реально використовують @layer для адаптивної верстки Рік тому я випустив серію з 3 відео про каскадні шари CSS (@layer) — що це таке, як вони працюють і з чим їх їдять. З того часу підтримка в браузерах виросла до ~96% глобально, і фіча офіційно отримала статус Baseline Widely Available. У цьому відео розбираю реальний кейс верстки, який мені показали: людина розділила стилі для Mobile, Tablet і Desktop за допомогою трьох медіазапитів, всередині яких просто змінюється пріоритизація шарів. Розбираємось: — чому це фактично то Mobile First, то Tablet First залежно від ширини екрана — як пріоритизація шарів працює всередині медіазапитів — чому такий підхід не звільняє від копіпасту стилів — чи варто взагалі так робити Дивись попередню серію про каскадні шари CSS на цьому каналі (плейлист у шапці каналу). Підписуйся, щоб не пропустити нові відео про сучасний CSS, і пиши в коментарях свою думку про цей підхід — використовував би таке у себе в проєкті? #CSS #CascadeLayers #Frontend #Верстка #WebDev #CSSLayer #АдаптивнаВерстка 👇👇👇 👻 Підтримуй Frontend Shinobi MONO BASE: https://base.monobank.ua/C1uWCbvj5KXoya БАНКА - https://send.monobank.ua/jar/5tEodxQoEu Крипта - USDT 0x284eF2F4db8B27905d68bBBECBC95a119259A395 Зроби цей світ краще 👇 👇 👇 🇺🇦 Фонд Притули - https://prytulafoundation.org/ 🇺🇦 Стерненко - https://www.sternenkofund.org/ 🇺🇦 Повернись Живим - https://savelife.in.ua/
Коментарі
Щоб написати, увійдіть.
Коментарів ще немає. Ваш буде першим.
Цей канал 115 відео в індексі
Більше від «Frontend Shinobi»
7:55CSS Container Queries на практиці: коли @media недостатньо | + corner-shape
7:31Адаптивна сітка css grid — чому це працює
12:06🔥 Забудь про JavaScript: CSS слайдер, який працює без JS
21:36CSS Nesting - Чим відрізняється від CSS? І чи варто його використовувати?
22:53🇺🇦 CSS анімація кнопки, що слідкує за курсором миші | Без JavaScript
11:19🇺🇦 Грід для новачків. CSS GRID - як користуватися? Complete beginners grid tutorial. Частина 4
Шорти цього каналу
1:13Анімація Transition: Як зробити її бездоганною
1:09CSS Грід: Простий Підхід до Створення Адаптивного Дизайну
1:56Грід-розміщення: Як правильно налаштувати банер
1:17Розкриття Shadow DOM: Як використовувати DevTools
0:17Анімація маски: Крок за кроком до творчості
2:19Оптимізація макетів: Гнучкі гріди для вашого сайту
1:52Маски в Дизайні: Як Використовувати Прозорість для Ефектів
1:55CSS для банера: Створення і налаштування
0:32Ефектна анімація зображень: Підказки для Hover Transition
0:58Простий спосіб використання атрибута open без JavaScript
1:33Створення GIF з Альфа-Шаром: Легкий Посібник
0:39