Novità sulla piattaforma web a marzo

Scopri alcune delle funzionalità interessanti introdotte nei browser web stabili e beta durante marzo 2022.

Rachel Andrew

Release stabili del browser

A marzo, Chrome 99, Chrome 100, Firefox 98 e Safari 15.4 sono diventati stabili. Ciò ha portato alla piattaforma una serie di nuove funzionalità e molte di queste aggiunte hanno portato alla disponibilità della funzionalità in tutti e tre i motori dei browser. In questo post mi sono concentrato sulle aggiunte che ci offrono l'interoperabilità tra browser, ma dai un'occhiata alle note di rilascio per vedere tutte le funzionalità aggiunte a ciascun motore.

Chrome 99 e Safari 15.4 includevano i livelli a cascata. La regola at @layer definisce un livello a cascata, che ti consente di controllare la specificità. Si uniscono a Firefox, quindi Cascade Layers è ora disponibile in tutti e tre i motori del browser. Scopri di più sui livelli in cascata in I livelli in cascata saranno presto disponibili nel tuo browser.

Supporto dei browser

  • Chrome: 99.
  • Edge: 99.
  • Firefox: 97.
  • Safari: 15.4.

Origine

Chrome 100 include il nuovo valore plus-lighter per la proprietà CSS mix-blend-mode. Questo valore è utile quando si applica la transizione tra due elementi quando tutti o un sottoinsieme di pixel hanno gli stessi valori. Per ulteriori informazioni sul problema che questo risolve, consulta l'articolo La dissolvenza incrociata di qualsiasi due elementi DOM al momento è impossibile.

Supporto dei browser

  • Chrome: 100.
  • Edge: 100.
  • Firefox: 99.
  • Safari: 9.1.

Safari 15.4 include la proprietà contain, che consente il contenimento dei CSS.

Supporto dei browser

  • Chrome: 52.
  • Edge: 79.
  • Firefox: 69.
  • Safari: 15.4.

Origine

In Safari 15.4 è presente anche accent-color, che consente di controllare il colore di accento utilizzato in alcuni controlli modulo.

Supporto dei browser

  • Chrome: 93.
  • Edge: 93.
  • Firefox: 92.
  • Safari: 15.4.

Origine

In Firefox 98 e Safari 15.4 è stato implementato l'elemento <dialog>, che rappresenta una finestra di dialogo.

Supporto dei browser

  • Chrome: 37.
  • Edge: 79.
  • Firefox: 98.
  • Safari: 15.4.

Origine

Safari 15.4 ha anche completato il supporto della pseudo-classe :focus-visible. I lavori di implementazione sono stati eseguiti da Igalia.

Supporto dei browser

  • Chrome: 86.
  • Edge: 86.
  • Firefox: 85.
  • Safari: 15.4.

Origine

Release beta del browser

Le versioni beta del browser ti offrono un'anteprima delle funzionalità che saranno disponibili nella prossima versione stabile del browser. È un'ottima occasione per testare nuove funzionalità o rimozioni che potrebbero influire sul tuo sito prima che la release venga resa disponibile a livello globale.

A marzo sono state rilasciate le nuove versioni beta Chrome 101 e Firefox 99.

Chrome 101 beta include la notazione dei colori hwb. Specifica il colore in base alla tonalità, alla bianchezza e al nero. Come nel caso di altre notazioni a colori, un componente alfa facoltativo specifica l'opacità.

h1 {
  color: hwb(194 0% 0% / .5) /* #00c3ff with 50% opacity */
}

Supporto dei browser

  • Chrome: 101.
  • Edge: 101.
  • Firefox: 96.
  • Safari: 15.

Origine

Firefox 99 include la proprietà pdfViewerEnabled dell'interfaccia Navigator. Questa proprietà indica se il browser supporta la visualizzazione in linea dei file PDF.

if (!navigator.pdfViewerEnabled) {
  // The browser does not support inline viewing of PDF files.
}

Supporto dei browser

  • Chrome: 94.
  • Edge: 94.
  • Firefox: 99.
  • Safari: 16.4.

Origine

Queste funzionalità beta saranno presto disponibili nei browser stabili.

Componente della serie Novità sul web