Новое в Chrome 154

Рэйчел Эндрю

Опубликовано: 22 сентября 2026 г.

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

Основные моменты этого релиза:

  • Адаптивный размер <iframe> позволяет <iframe> изменять свой размер в зависимости от внутреннего размера встроенного документа.
  • CSS- scroll-marker-group modes добавляет режимы links и tabs , позволяющие настраивать порядок фокусировки и семантику доступности маркеров прокрутки.
  • CSS- text-decoration-inset позволяет регулировать начальную и конечную точки текстовых элементов оформления.

Адаптивный размер <iframe>

В Chrome 154 добавлена ​​поддержка адаптивных iframe-элементов, позволяющая элементу <iframe> в родительском документе изменять свой размер в соответствии с размером макета встроенного документа, чтобы избежать прокрутки в дочернем документе. Это заменяет схему, при которой вы вручную измеряли содержимое iframe, передавали размеры с помощью postMessage() и обновляли размер iframe на странице встраивания.

Чтобы задать размер iframe в соответствии с высотой его содержимого, используйте свойство CSS frame-sizing элемента <iframe> на странице встраивания:

.embed {
  width: 100%;
  frame-sizing: content-height;
}

Встроенный документ также должен подтвердить свое согласие, добавив элемент <meta name="responsive-embedded-sizing"> в свой <head> :

<meta name="responsive-embedded-sizing" content="allow-origins=*">

Более подробную информацию и примеры использования см. в разделе «Адаптивные iframe в Chrome 154» .

CSS scroll-marker-group modes

Свойство scroll-marker-group определяет, будет ли контейнер прокрутки генерировать псевдоэлемент ::scroll-marker-group до или после своего содержимого. В Chrome 154 свойство scroll-marker-group расширено двумя режимами, которые устанавливают порядок фокусировки и семантику доступности WAI-ARIA для ::scroll-marker-group и ::scroll-marker :

/* Links mode (default) */
scroll-marker-group: after links;

/* Tabs mode */
scroll-marker-group: before tabs;

CSS text-decoration-inset

По умолчанию текстовое оформление элемента (например, подчеркивание, надчеркивание или зачеркивание) имеет ту же длину, что и отображаемый текст. Свойство CSS text-decoration-inset позволяет настроить начальную и конечную точки текстового оформления элемента таким образом, чтобы оно отступало от краев текста, выходило за их пределы или смещалось относительно них.

text-decoration-inset принимает значения auto , length и percentage, используя синтаксис с одним или двумя значениями, например, для отступа с обоих концов на 10 пикселей:

text-decoration-inset: 10px;

Положительные значения отступают (делая его короче), а отрицательные — выступают за его пределы (делая его длиннее). Это позволяет точно настраивать расстояние между элементами оформления и создавать анимированные эффекты подчеркивания с помощью текстовых элементов CSS вместо фоновых градиентов или дополнительных элементов.

Для получения более подробной информации см. документацию text-decoration-inset на MDN .

Дополнительная информация

Здесь описаны лишь некоторые ключевые моменты. Дополнительные изменения в Chrome 154 можно найти по следующим ссылкам:

Подписаться

Чтобы быть в курсе всех новостей, подпишитесь на YouTube-канал Chrome Developers , и вы будете получать уведомления по электронной почте каждый раз, когда мы выпускаем новое видео. Или подпишитесь на нас в X или LinkedIn, чтобы получать новые статьи и записи в блоге.

Как только выйдет Chrome 155, мы сразу же расскажем вам о новинках в Chrome!