Новое на веб-платформе в мае

Ознакомьтесь с некоторыми интересными функциями, которые появились в стабильных и бета-версиях веб-браузеров в мае 2026 года.

Рэйчел Эндрю

Опубликовано: 29 мая 2026 г.

Стабильные версии браузера

В мае в стабильную версию Chrome вышли версии 148 , Firefox 151 и Safari 26.5 . В этой статье мы рассмотрим множество новых функций, появившихся в этом месяце.

Псевдокласс CSS ` :open преобразуется в `Baseline`.

Safari 26.5 — это в основном релиз с исправлениями существующих функций. Однако он также включает поддержку псевдокласса :open , что делает эту функцию доступной в базовой версии.

Псевдокласс :open позволяет стилизовать элементы, которые имеют состояния «открыто» и «закрыто», когда они открыты. Это относится к таким элементам, как <details> и <dialog> , когда они открыты, а также к элементам <select> и ` <input> (например, средства выбора цвета или даты), когда отображаются их интерфейсы выбора. Это обеспечивает более чистую и семантическую альтернативу стилизации с использованием атрибутов, таких как details[open] .

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: 136.
  • Сафари: 26,5.

Source

CSS-запросы для контейнеров, содержащие только имя, становятся базовыми.

В этом месяце с выходом Chrome 148 появилась новая функция — запросы к контейнерам, содержащие только имена .

Ранее при написании запроса к контейнеру требовалось указывать условие запроса по размеру или стилю вместе с именем контейнера, а также определять тип контейнера с помощью свойства container-type . Теперь вы можете проверить наличие именованного контейнера только по его имени, без каких-либо дополнительных условий. Более того, вам больше не нужно устанавливать container-type для родительского элемента, если вы запрашиваете только по имени:

#container {
  container-name: --sidebar;
}

@container --sidebar {
  .content {
    padding: 2rem;
  }
}

Browser Support

  • Chrome: 148.
  • Edge: 148.
  • Firefox: 149.
  • Сафари: 26.4.

Запросы в контейнерном стиле для пользовательских свойств становятся частью базовой модели.

В Firefox 151 появилась поддержка запросов style() для аннотации @container , что делает запросы стиля контейнера для пользовательских свойств доступными в базовой версии.

Запросы стилей контейнера позволяют применять стили к элементам на основе CSS-свойств родительского контейнера. В то время как запросы размеров чрезвычайно мощны, запросы стилей позволяют запрашивать не только параметры размера. В частности, в этом релизе реализована полная кроссбраузерная поддержка запросов пользовательских свойств. Например, вы можете проверить, установлено ли для пользовательского свойства --theme значение dark в родительском контейнере:

@container style(--theme: dark) {
  .card {
    background-color: #1a1a1a;
    color: #fff;
  }
}

Browser Support

  • Chrome: 111.
  • Край: 111.
  • Firefox: 151.
  • Сафари: 18.

Ленивая загрузка видео- и аудиоэлементов

В Chrome 148 реализована встроенная функция отложенной загрузки для элементов <video> и <audio> с атрибутом loading="lazy" .

Подобно элементам <img> и <iframe> , теперь вы можете указать браузеру задерживать загрузку медиаресурсов до тех пор, пока они не окажутся близко к области просмотра. Это помогает улучшить скорость загрузки страницы, сэкономить пропускную способность и уменьшить потребление данных пользователями. Узнайте больше от команды, которая реализовала эту функцию, в статье «Как использовать стандартную отложенную загрузку HTML-видео и аудио в Интернете сегодня» .

Browser Support

  • Chrome: 148.
  • Edge: 148.
  • Firefox: не поддерживается.
  • Safari: не поддерживается.

Source

API "Картинка в картинке" для документов

В Firefox 151 добавлена ​​поддержка API "картинка в картинке" для документов на настольных платформах.

В отличие от стандартного API «Картинка в картинке», который позволяет просматривать элемент <video> в постоянно открытом окне, API «Картинка в картинке» для документов позволяет открывать постоянно открытое окно, содержащее произвольный HTML-контент. Это позволяет создавать интерактивные наложения, такие как сетки участников видеоконференций, интерактивные биржевые тикеры или таймеры, которые сохраняются даже при переходе на другую страницу.

Browser Support

  • Chrome: 116.
  • Край: 116.
  • Firefox: 151.
  • Safari: не поддерживается.

Source

API Web Serial расширяет поддержку платформы.

В Firefox 151 добавлена ​​поддержка Web Serial API на настольных платформах, а в Chrome 148 — на Android.

API Web Serial предоставляет веб-сайтам возможность считывать и записывать данные на последовательные устройства, например, микроконтроллеры, 3D-принтеры, платы разработки и периферийное оборудование. В Firefox использование API Web Serial требует от пользователей установки искусственно сгенерированного дополнения для управления правами доступа к сайту, что обеспечивает безопасный и контролируемый механизм управления доступом.

Browser Support

  • Chrome: 89.
  • Край: 89.
  • Firefox: 151.
  • Safari: не поддерживается.

Source

Выпуск бета-версий браузера

Бета-версии браузеров позволяют предварительно ознакомиться с функциями следующей стабильной версии. Это отличное время для тестирования новых функций или удаления функций, которые могут повлиять на ваш сайт, до того, как эта версия станет доступна всему миру. В этом месяце вышли новые бета-версии Chrome 149 и Firefox 152. В этом месяце бета-версии Safari нет.

В бета-версии Chrome 149 представлены интересные обновления CSS, такие как CSS-декорации пробелов, позволяющие стилизовать промежутки между элементами flex и grid. Также поддерживаются функции path() и shape() , а также базовые функции для работы с фигурами rect() и xywh() в свойстве shape-outside , и path-length в качестве свойства CSS. Что касается API, программные методы прокрутки, такие как scrollTo() , scrollBy() и scrollIntoView() теперь возвращают промисы, разрешающиеся после завершения плавной прокрутки, а страницы с активными соединениями WebSocket теперь могут использовать кэширование назад/вперед (BFCache).

В Firefox 152 beta добавлена ​​полная поддержка свойства field-sizing , позволяющего элементам управления формами автоматически изменять свой размер в соответствии с содержимым. Также добавлены свойства actions и maxActions в интерфейс Notification , а также поддержка options.pseudoElement в Element.getAnimations() .