Новый CSS и HTML!

CSS и HTML улетели далеко вперед! Фронтендеры за ним не поспевают! Экскурсия в мир актуальной верстки! 0:00 CSS и HTML прорыв?! 0:25 Контейнерные запросы 0:55 Style Queries 1:38 :has 2:16 :nth-of 2:42 text-wrap: balance 3:12 initial-letter 3:36 svh, lvh, dvh 4:48 Цветовое пространство с широкой гаммой 5:33 color-mix() 6:27 Nesting 6:45 Каскадные слои 8:51 Scope 9:59 Синусы / косинусы 10:12 Индивидуальные свойства для transform 10:35 Subgrid 11:20 Masonry grid 11:36 Вертикальный режим отображения текста 11:49 Новые логические свойства 13:06 aspect-ratio 13:27 content-visibility 15:02 Подписка 15:38 Flexbox gap 16:10 Object view box 16:52 Media Queries Range 17:11 mix-blend-mode 17:37 filter 17:52 backdrop-filter 18:19 linear easy function 18:51 min, max, fit-content 20:52 conic-gradient 21:18 accent-color 21:35 currentColor 21:54 Относительные цвета 22:24 Цветовые пространства для градиента 22:40 Scroll Snap 23:07 Overscroll-behavior 23:45 Touch action 24:04 Scroll-behavior 24:22 Scrollbar gutter 25:00 font-display 26:00 line-clamp 26:18 Вариативные шрифты 27:25 Подписка 27:48 font-palette 28:15 prefers-reduced-motion 28:34 prefers-color-scheme 28:45 prefers-reduced-data 29:09 color-scheme 29:27 prefers-contrast 29:41 Режим принудительных цветов 29:55 focus-visible 30:23 CSS-переменные 30:41 Supports 30:55 Функции сравнения (min, max, clamp) 31:30 property 31:46 :marker 32:22 image-set 32:40 image() 33:15 Popover API 33:49 Dialog 34:23 Anchor positioning 35:18 Кастомный селект 35:40 Анимация дискретных свойств 36:25 Scroll driven animation 36:51 View Transitions API 37:22 Резюме ***************** Тренажеры HTML Академии Книга рецептов фронтендера Академия комьюнити за 99 рублей: Для оплаты с НЕ российских карт: Если не открывается: K1H8FmJKURg0MGYy Какие тренажеры бывают: #fe-start Мой телеграм: ****************** Ссылки: 1) Подробно про контейнерные запросы 2) Поиграть с новыми цветовыми пространствами 3) Поиграть с color-mix 4) Видос про mix-blend-mode эффекты 5) Про функции сравнения (min, max, clamp) 6) Про property в css Houdini 7) Про CSS scroll snap 8) Про стратегии font-display #css #html #frontend #javascript