Веб-страница

Последние публикации канала «Веб-страница»

1. 3.3K просмотров, 5 реакций, 14 июл. 2026 г.

   Chrome 151 даёт декларативный доступ к камере и микрофону через <usermedia> Если делали видеочаты или редакторы с захватом с камеры, знаете боль: вызовы getUserMedia() , ручные запросы разрешений и пользователи, случайно нажавшие «запретить» и застрявшие в тупике. Новый HTML-элемент <usermedia> , доступный с Chrome 151, убирает эту рутину. Вместо скриптового запроса права вы получаете декларативный элемент управления, который сам отслеживает намерение пользователя, управляет запросом браузера и передаёт готовый MediaStream в приложение. Это сокращает шаблонный код и даёт браузеру достоверный…

   Открыть пост в MAX
2. 1.3K просмотров, 6 реакций, 14 июл. 2026 г.

   Тёмная тема через веб-стандарты Белая вспышка при загрузке, лишний React-контекст и рассинхрон с системой — Ollie Williams разбирает , как от этого уйти веб-стандартами. prefers-color-scheme берёт системную настройку, а мета-тег name="color-scheme" в head даёт браузеру подсказку раньше CSS. Можно обойтись без тяжёлой темизации: по клику меняете атрибут content на light , dark или light dark и сохраняете выбор в localStorage . При следующем открытии применяете его до рендера, и вспышки нет. Главный вывод для меня: стандартный механизм снимает задачу с JS-фреймворка и даёт нативный фолбэк. Если…

   Открыть пост в MAX
3. 1.4K просмотров, 4 реакций, 14 июл. 2026 г.

   Анимированная радиальная маска на тексте через CSS Если делаете запоминающиеся заголовки или интерактивные обложки, эта техника пригодится. Тут показали, как повторить на CSS эффект из блога Nikhil: слово «Hello!» перекрывается концентрическими кругами, и получается живое «просвечивание» текста. Суть — mask плюс repeating-radial-gradient . Прозрачные участки градиента скрывают буквы, непрозрачные оставляют. Чтобы понять механику, автор советует заменить радиальный градиент на linear-gradient — сразу видно, как альфа-канал управляет видимостью. Шрифт тоже важен: круглая буква «o» держит кольца…

   Открыть пост в MAX
4. 1.9K просмотров, 5 реакций, 13 июл. 2026 г.

   UI-паттерны, которые скоро можно делать без JS Если верстаете интерфейсы каждый день, я бы сохранил этот доклад Уны Кравец с CSS Day 2026 в закладки. Она разобрала, как новые CSS-возможности убирают типичный скриптовый код: sticky-заголовок прячется через scroll-state(stuck: top) , а hover-тултипы собираются на атрибутах interesttarget и popover=hint — почти без JavaScript. Ещё два момента: sibling-index() задаёт staggered-задержки прямо в CSS, а border-shape позволяет рисовать необычные формы границ вместо border-radius . Пока часть фич работает не везде — polyfill для invokers не тянет на…

   Открыть пост в MAX