Descubra alguns dos recursos interessantes que chegaram na versão Stable e Beta. navegadores da Web em dezembro de 2023.
Lançamentos de navegadores estáveis
Em dezembro de 2023, no Firefox 121, Chrome 120 e O Safari 17.2 se tornou estável. Esta postagem aborda o que isso significa para a plataforma Web.
Análise tranquila para transição de CSS
O Chrome 120 e o Safari 17.2 incluem análise relaxada para transição de CSS. Como isso tem suporte do Firefox a partir da versão 117, isso significa que todos os principais mecanismos são compatíveis com essa mudança de sintaxe.
Acordeões exclusivos com o elemento <details>
O Chrome 120 e o Safari 17.2 incluem suporte para o atributo name
do
<details>
. Isso significa que você pode criar componentes exclusivos de acordeão
agrupando vários elementos <details>
.
Saiba mais em acordeão exclusivo.
Compatibilidade com navegadores
- 120
- 120
- x
- 17,2
O seletor :has()
O Firefox 121 inclui o seletor CSS :has()
. Esta versão torna o :has()
interoperável em todos os principais mecanismos.
Saiba mais no :has()
: seletor de família.
API de destaque personalizado do CSS
O Safari 17.2 inclui a
API CSS Custom Spotlight
que permite criar e estilizar intervalos de texto,
estendendo as pseudoclasses de destaque padrão, como ::selection
;
API CloseWatcher
O Chrome 120 inclui a API CloseWatcher, uma nova API para detectar e responder a solicitações de fechamento.
Essas solicitações são acionadas pela tecla ESC
no computador e pelo gesto ou botão "Voltar" no Android.
e pode ser complicado de implementar bem.
Além da API, o Chrome 120 faz upgrade da <dialog>
e do atributo popover
para responder ao botão "Voltar" do Android.
Compatibilidade com navegadores
- 126
- 126
- x
- x
CSS text-wrap: balance
e stable
O Firefox 121 inclui os valores balance
e stable
para text-wrap
.
O valor balance
é útil para blocos curtos de conteúdo, como cabeçalhos,
criando textos mais
agradáveis e fáceis de ler. O valor stable
impede que o conteúdo editável mude novamente durante a edição.
Saiba mais sobre text-wrap: balance
.
text-wrap: balance
text-wrap: stable
Carregamento lento de elementos <iframe>
O Firefox 121 é compatível com o atributo loading
em elementos <iframe>
.
Isso significa que o carregamento lento de iframes agora tem suporte em todos os principais mecanismos.
Compatibilidade com navegadores
- 77
- 79
- 121
- 16.4
Suporte à função de easing linear()
.
O Safari 17.2 também é compatível com a função de easing linear()
, que pode ser usada para criar
efeitos de rejeição e mola.
Compatibilidade com navegadores
- 113
- 113
- 112
- 17,2
Versões do navegador Beta
As versões Beta do navegador mostram uma prévia do que vai acontecer nas próximas versão estável do navegador. É um ótimo momento para testar novos recursos ou remoções, que poderiam afetar seu site antes do lançamento oficial. Novo Betas são Firefox 122 Chrome 121 e Safari 17.3 Esses lançamentos trazem muitos recursos excelentes para a plataforma. Confira o lançamento a observação para todos os detalhes. Estes são alguns destaques.
O Firefox 122 e o Chrome 121 incluem o método showPicker()
para HTMLSelectElement.
Isso mostra o mesmo seletor que seria mostrado quando o elemento fosse selecionado,
mas pode ser acionado ao pressionar
um botão ou outra interação do usuário.
O Chrome 121 inclui as propriedades de estilo da barra de rolagem scrollbar-color
e scrollbar-width
.
junto com um mascaramento CSS aprimorado para SVG,
e destacar pseudoelementos em textos com erros ortográficos ou erros gramaticais.