Iniciante na plataforma da Web em janeiro

Descubra alguns dos recursos interessantes que chegaram em navegadores da Web estáveis e Beta em janeiro de 2022.

Rachel Andrew

Versões estáveis do navegador

Em janeiro, o Chrome 97 e o Firefox 96 se tornaram estáveis.

O Firefox 96 enviou a função de cor hwb(). Essa função expressa uma cor por matiz, brancura e escuridão.

Compatibilidade com navegadores

• 101
• 101
• 96
• 15

Origem

A propriedade CSS color-scheme também está disponível no Firefox 96. Esta propriedade oferece uma maneira de indicar os esquemas de cores em que um elemento pode ser renderizado. Por exemplo, para indicar que .widget pode ser renderizado nos modos claro ou escuro do sistema operacional, use o CSS abaixo.

.widget {
  color-scheme: light dark;
}

Com a página de destino do esquema de cores no Firefox, isso significa que a propriedade está disponível no Chrome, Firefox e Safari.

Compatibilidade com navegadores

• 81
• 81
• 96
• 13

Origem

Versões Beta do navegador

As versões Beta do navegador oferecem uma prévia dos recursos que vão estar na próxima versão estável do navegador. É um ótimo momento para testar novos recursos ou exclusões que possam afetar seu site antes que o mundo receba a versão.

As versões Beta de janeiro foram o Chrome 98, o Firefox 97 e o Safari 15.4 Beta 1.

O Chrome 98 oferece suporte a fontes vetoriais de gradiente de cor COLRv1 como um novo formato de fonte. Uma fonte colorida contém glifos com várias cores, como um emoji, uma bandeira de país ou uma letra multicolorida.

Leia mais sobre esse novo formato de fonte em Fontes vetoriais de gradiente de cor COLRv1 no Chrome 98.

Também está incluído o método structuredClone() para fazer cópias profundas de objetos e as consultas de mídia CSS dynamic-range e video-dynamic-range. Encontre mais recursos para testar na postagem do Chrome 98 Beta.

O Chrome DevTools 98 traz uma coleção de novos recursos, incluindo a nova árvore de acessibilidade completa.

O Firefox 97 Beta oferece suporte às unidades cap e ic para length e também implementa a propriedade scrollbar-gutter.

Há uma coleção de recursos interessantes incluídos no Safari 15.4 Beta. Os recursos incluem a implementação do pseudoelemento ::backdrop, a pseudoclasse :focus-visible, a propriedade accent-color e o contenção do CSS com a propriedade contain. Essa versão Beta também inclui o elemento HTML <dialog>, o atributo lazy em imagens para ativar o carregamento lento, além de suporte para ícones do manifesto de apps da Web.

Todos esses recursos Beta serão lançados em breve nos navegadores estáveis.

Parte da série na Web do Google