Nouveaux utilisateurs sur la plate-forme Web en mars

Découvrez quelques-unes des fonctionnalités intéressantes qui ont été intégrées aux navigateurs Web stables et bêta en mars 2022.

Versions stables du navigateur

En mars, Chrome 99, Chrome 100, Firefox 98 et Safari 15.4 sont devenus stables. De nombreuses nouvelles fonctionnalités ont ainsi été ajoutées à la plate-forme. Un grand nombre de ces ajouts l'ont rendue disponible sur les trois moteurs de navigateur. Dans cet article, je me suis concentré sur les ajouts qui nous permettent d'assurer l'interopérabilité entre les navigateurs. Consultez toutefois les notes de version pour découvrir toutes les fonctionnalités ajoutées à chaque moteur.

Chrome 99 et Safari 15.4 incluent les couches en cascade. L'élément @layer à la règle définit une couche en cascade, ce qui vous aide à contrôler la spécificité. Ils rejoignent Firefox. Les calques en cascade sont donc désormais disponibles dans les trois moteurs de navigateur. Pour en savoir plus sur les calques en cascade, consultez Les calques en cascade arrivent dans votre navigateur.

Navigateurs pris en charge

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

Source

Chrome 100 inclut la nouvelle valeur de plus-lighter pour la propriété CSS mix-blend-mode. Cette valeur est utile lors du fondu enchaîné de deux éléments lorsque tous les pixels ou un sous-ensemble de pixels ont les mêmes valeurs. Pour en savoir plus sur le problème résolu, consultez Le fondu croisé entre deux éléments DOM est actuellement impossible.

Navigateurs pris en charge

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

Safari 15.4 inclut la propriété contain, qui permet la structuration CSS.

Navigateurs pris en charge

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

Source

Safari 15.4 inclut également accent-color, qui permet de contrôler la couleur d'accentuation utilisée sur certains éléments de contrôle de formulaire.

Navigateurs pris en charge

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

Source

Firefox 98 et Safari 15.4 renvoient l'élément <dialog>, qui représente une boîte de dialogue.

Navigateurs pris en charge

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

Source

Safari 15.4 est également compatible avec la pseudo-classe :focus-visible. Le travail d'implémentation a été confié à Igalia.

Navigateurs pris en charge

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

Source

Versions bêta des navigateurs

Les versions bêta du navigateur vous donnent un aperçu des éléments qui seront disponibles dans la prochaine version stable du navigateur. C'est le moment idéal pour tester les nouvelles fonctionnalités ou les suppressions qui pourraient avoir un impact sur votre site avant que tout le monde ne les ait.

Les nouvelles versions bêta de mars étaient Chrome 101 et Firefox 99.

La version bêta de Chrome 101 inclut la notation de couleur hsv. Il spécifie la couleur en fonction de sa teinte, de sa blancheur et de son noirceur. Comme pour les autres notations de couleur, un composant alpha facultatif spécifie l'opacité.

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

Navigateurs pris en charge

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

Source

Firefox 99 inclut la propriété pdfViewerEnabled de l'interface Navigator. Cette propriété indique si le navigateur est compatible avec l'affichage intégré des fichiers PDF.

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

Navigateurs pris en charge

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

Source

Ces fonctionnalités bêta seront bientôt disponibles dans les navigateurs stables.

Partie de la série Nouveau sur le Web