Опубликовано: 17 июля 2026 г.
Снова приветствуем вас в ежемесячном дайджесте Baseline. В июне 2026 года field-sizing стала доступна в Baseline Newly, что позволило элементам управления формами автоматически подстраиваться под свое содержимое. Тем временем, широкий спектр функций CSS, HTML и Web API также получил статус Baseline Widely available, наряду с важными обновлениями от сообщества разработчиков.
Базовые оповещения о состоянии веб-платформы
Теперь отслеживать совместимость веб-функций стало проще благодаря оповещениям Baseline Alerts на панели мониторинга состояния веб-платформы . Войдя в систему через GitHub, вы можете подписаться на уведомления о новых функциях, которые становятся доступными в рамках базовой версии, широко доступными или получают новые реализации в браузерах. Подписки можно настроить для отправки обновлений по электронной почте или пользовательских RSS-лент по ежемесячному, еженедельному или немедленному расписанию. Вы можете ограничить оповещения сохраненными поисковыми запросами — как и для всех функций HTML — создавать пользовательские информационные бюллетени, генерировать списки функций, которыми можно делиться, или настраивать веб-перехватчики Slack для уведомления вашей команды разработчиков.
Подробнее см. в разделе «Введение в базовые оповещения» .
Базовый уровень. Новые доступные функции.
Функции, описанные в этом разделе, поддерживаются в базовом наборе браузера с июня 2026 года и теперь являются базовыми функциями, доступными в данный момент.
field-sizing
Свойство CSS ` field-sizing позволяет управлять поведением изменения размеров элементов формы, таких как <textarea> , <input> и <select> , которые традиционно имеют фиксированные размеры по умолчанию. С помощью field-sizing: content элементы управления формы автоматически расширяются или сжимаются в соответствии со своим содержимым, что снижает необходимость в пользовательских скриптах JavaScript для автоматического изменения размера.
Более подробную информацию можно найти на справочной странице MDN, посвященной определению размера поля .
Базовые широкодоступные функции
Следующие функции стали широко доступны в базовой версии, что означает, что теперь они в значительной степени совместимы и могут быть использованы в ваших проектах.
:has() псевдокласс
Селектор родительского элемента CSS ` :has() позволяет стилизовать элемент на основе его потомков или последующих соседей. Этот функциональный псевдокласс позволяет использовать условные шаблоны компоновки непосредственно в CSS без необходимости использования JavaScript для анализа структуры DOM.
Подробнее об псевдоклассе :has можно прочитать на странице MDN .
HTMLIFrameElement.loading
Свойство loading элементов <iframe> включает отложенную загрузку встроенных фреймов. Указав loading="lazy" , браузеры откладывают загрузку iframe, находящихся за пределами видимой области экрана, до тех пор, пока они не будут прокручены ближе к области просмотра, что позволяет экономить пропускную способность сети и накладные расходы на первоначальную загрузку страницы.
Подробную информацию о HTMLIFrameElement.loading можно найти в справочнике MDN .
CanvasRenderingContext2D.reset()
Метод reset() в контексте 2D-холста очищает состояние контекста рисования, сбрасывая такие свойства, как преобразования, контуры обрезки, стили линий и заливки, до значений по умолчанию. Это позволяет повторно использовать контекст холста без необходимости ручной очистки свойств.
Более подробную информацию можно найти в документации MDN по методу CanvasRenderingContext2D.reset .
единица длины cap
Единица измерения cap font-relative соответствует номинальной высоте заглавных букв шрифта элемента. Она позволяет выравнивать и изменять размер элементов относительно высоты заглавных букв, обеспечивая точную типографическую компоновку.
Более подробную информацию о единицах измерения длины можно найти в справочнике MDN .
свойство counter-set
Свойство CSS counter-set устанавливает счетчик CSS на заданное значение, дополняя свойства counter-reset и counter-increment . Оно обеспечивает управление при работе с нумерованными списками, структурами документов или пользовательскими последовательностями счетчиков.
Подробную информацию о наборе счетчиков можно найти на странице MDN .
createImageBitmap()
Статический метод createImageBitmap() создает асинхронное растровое изображение из различных источников изображений, включая <img> , <canvas> , Blob или ImageData . Поскольку он декодирует изображения вне основного потока, это позволяет избежать снижения производительности пользовательского интерфейса при обработке сложных графических элементов холста.
Подробности реализации функции createImageBitmap см. в документации MDN .
<easing-function> тип данных
Тип данных CSS ` <easing-function> описывает математические кривые скорости изменения для переходов и анимаций. Помимо стандартных ключевых слов, таких как ease-in или cubic-bezier() , он поддерживает функции, такие как linear() , для создания пользовательских эффектов пружины или отскока.
Узнайте, как использовать эту функцию, в справочнике MDN по функции easing-function .
& селектор вложенности
Селектор вложенности & явно привязывает дочерние селекторы правил к родительскому селектору при использовании встроенной в CSS вложенности. Он обеспечивает ясность и корректность правил специфичности при определении вложенных состояний наведения курсора, фокусировки или псевдоклассов.
Подробную информацию о селекторе вложенности см. в руководстве MDN .
Адаптивная предварительная загрузка с помощью rel="preload"
Атрибут media элементов ` <link rel="preload"> обеспечивает адаптивную предварительную загрузку ключевых ресурсов. Сочетая rel="preload" с медиа-запросами, браузеры загружают только те ресурсы, которые соответствуют ширине области просмотра пользователя или характеристикам отображения, на ранних этапах цикла загрузки.
Узнайте, как это использовать, в документации MDN для параметра rel="preload" .
HTMLMediaElement.preservesPitch
Свойство preservesPitch элементов <audio> и <video> определяет, будет ли браузер изменять высоту тона звука при изменении playbackRate . Установка значения false позволяет изменять высоту тона при ускорении или замедлении воспроизведения мультимедиа.
Подробную информацию о HTMLMediaElement.preservesPitch можно найти на странице MDN .
:dir() псевдокласс
Псевдокласс CSS ` :dir() сопоставляет элементы на основе направления текста (например, ltr или rtl ), определяя направление, унаследованное от HTML-атрибутов, таких как dir или вычисляемый текстовый контекст.
Подробнее об этом можно узнать на странице MDN, посвященной псевдоклассу :dir .
математическая функция pow()
Функция CSS pow() вычисляет значения экспоненциальной степени непосредственно в объявлениях CSS, возводя базовое число в степень (например, pow(2, 3) `). Это упрощает адаптивное масштабирование и математические соотношения сетки.
Подробную информацию о функции pow можно найти в справочнике MDN .
свойство mask CSS
Сокращенное свойство CSS ` mask скрывает части элемента, используя изображения или градиенты в качестве слоев обрезки. Оно объединяет подсвойства, такие как mask-image , mask-position и mask-repeat для создания сложных визуальных эффектов маскирования.
Более подробную информацию о свойстве маски можно найти на странице MDN .
@media (scripting)
Функция проверки доступности scripting позволяет определить, включено ли и доступно ли клиентское программирование (например, JavaScript) в контексте браузера. Это позволяет использовать стили прогрессивного улучшения для работы в средах с активным JavaScript или без него.
Подробнее о функции создания сценариев в формате мультимедиа можно узнать в справочнике MDN .
URL.canParse()
Статический метод URL.canParse() проверяет, является ли заданная строка допустимым, поддающимся анализу URL-адресом (с необязательным базовым URL-адресом) без генерации исключения, что упрощает проверку URL-адресов во время выполнения перед созданием объектов URL .
Подробности реализации см. в документации MDN для URL.canParse .
API доступа к хранилищу
API доступа к хранилищу предоставляет механизм для запроса доступа к файлам cookie и хранилищу для контента, встроенного в сторонние <iframe> элементы, что позволяет осуществлять аутентификацию и взаимодействие с сохранением состояния между доменами.
Подробную информацию об API доступа к хранилищу см. на странице MDN .
На этом всё.
Сообщите нам, если мы что-то упустили в отношении Baseline, и мы обязательно учтем это в будущей версии! Если у вас есть какие-либо вопросы или вы хотите оставить отзыв о Baseline, вы можете создать заявку в нашем трекере проблем .