Nuevo en la plataforma web en diciembre

Descubre algunas de las interesantes funciones que llegaron a las versiones estable y beta. navegadores web en diciembre de 2023.

En diciembre de 2023, Firefox 121: Chrome 120 y Safari 17.2 se volvió estable. Esta publicación analiza lo que eso significa para la plataforma web.

Análisis tranquilo para el período de prueba de CSS

Chrome 120 y Safari 17.2 incluyen análisis relajado para el período de Nesting de CSS. Como se admite en la versión 117 de Firefox, todos los motores principales admiten este cambio de sintaxis.

Acordeones exclusivos con el elemento <details>

Chrome 120 y Safari 17.2 incluyen compatibilidad con el atributo name para el elemento <details>. Esto significa que puedes crear componentes de acordeón exclusivos agrupando una serie de elementos <details>.

Obtén más información en acordeón exclusivo.

Navegadores compatibles

  • 120
  • 120
  • x
  • 17.2

El selector :has()

Firefox 121 incluye el selector :has() de CSS. Esta versión permite que :has() sea interoperable en todos los motores principales.

Obtén más información en :has(): el selector de familia.

Navegadores compatibles

  • 105
  • 105
  • 121
  • 15.4

Origen

La API de CSS Custom Highlight

Safari 17.2 incluye API de CSS Custom Highlight que te permite crear y aplicar estilos a rangos de texto, Extensión de las seudoclases estándar de resaltado, como ::selection

Navegadores compatibles

  • 105
  • 105
  • 17.2

Origen

La API de CloseWatcher

Chrome 120 incluye la API de CloseWatcher, una nueva API para escuchar y responder solicitudes de cierre. Estas solicitudes se activan con la tecla ESC en una computadora de escritorio y el gesto o botón Atrás en Android. y puede ser difícil de implementar.

Además de la API, Chrome 120 actualiza <dialog> y el atributo popover para responder al botón Atrás de Android.

Navegadores compatibles

  • 126
  • 126
  • x
  • x

text-wrap: balance y stable del CSS

Firefox 121 incluye los valores balance y stable para text-wrap. El valor balance es útil para bloques cortos de contenido, como encabezados, creando un texto más agradable y fácil de leer. El valor stable evita que el contenido editable se vuelva a mostrar mientras se realiza la edición.

Obtén más información sobre text-wrap: balance.

text-wrap: balance

Navegadores compatibles

  • 114
  • 114
  • 121
  • 17,5

Origen

text-wrap: stable

Navegadores compatibles

  • x
  • x
  • 121
  • 17,5

Origen

Carga diferida de elementos <iframe>

Firefox 121 admite el atributo loading en los elementos <iframe>. Esto significa que la carga diferida de iframes ahora es compatible con todos los motores principales.

Navegadores compatibles

  • 77
  • 79
  • 121
  • 16.4

Compatibilidad con la función de aceleración linear()

Safari 17.2 también incluye compatibilidad con la función de aceleración linear(), que se puede usar para crear efectos de rebote y de resorte.

Navegadores compatibles

  • 113
  • 113
  • 112
  • 17.2

Versiones beta del navegador

Las versiones beta del navegador te ofrecen una vista previa de lo que encontrarás en la próxima versión estable del navegador. Es un buen momento para probar nuevas funciones o que podrían afectar a tu sitio antes de que el mundo reciba ese lanzamiento. Nuevo las versiones beta son Firefox 122, Chrome 121 y Safari 17.3 Estos lanzamientos traen muchas funciones excelentes a la plataforma. Consulta la versión notas para todos los detalles. Estos son solo algunos de los aspectos destacados.

Firefox 122 y Chrome 121 incluyen el método showPicker() para HTMLSelectElement. Esto muestra el mismo selector que se mostraría cuando se elige el elemento, pero se puede activar presionando un botón o mediante otra interacción del usuario.

Chrome 121 incluye las propiedades de estilo de la barra de desplazamiento scrollbar-color y scrollbar-width, además de enmascaramiento de CSS mejorado para SVG, y destacar seudoelementos para el texto que esté mal escrito o sea gramaticalmente incorrecto.