Publié le : 17 juillet 2026
Bienvenue dans le récap mensuel de Baseline. En juin 2026, field-sizing est devenu Baseline Newly available, ce qui permet aux contrôles de formulaire de s'adapter automatiquement à leur contenu. Parallèlement, un large éventail de fonctionnalités CSS, HTML et Web API ont atteint l'état "Baseline largement disponible", en plus d'importantes mises à jour de la communauté des développeurs.
Alertes de référence sur l'état de la plate-forme Web
Il est désormais plus facile de savoir quand les fonctionnalités Web deviennent interopérables grâce aux alertes de référence sur le tableau de bord d'état de la plate-forme Web. En vous connectant avec GitHub, vous pouvez vous abonner aux notifications concernant les fonctionnalités lorsqu'elles deviennent "Nouvellement disponibles", "Largement disponibles" ou reçoivent de nouvelles implémentations de navigateur. Vous pouvez configurer les abonnements pour envoyer des notifications par e-mail ou des flux RSS personnalisés selon une fréquence mensuelle, hebdomadaire ou immédiate. Vous pouvez définir des alertes pour des recherches enregistrées (comme toutes les fonctionnalités HTML), créer des newsletters personnalisées, générer des listes de fonctionnalités partageables ou configurer des webhooks Slack pour avertir votre équipe d'ingénieurs.
Pour en savoir plus, consultez Présentation des alertes de référence.
Fonctionnalités de base nouvellement disponibles
Les fonctionnalités de cette section sont prises en charge depuis juin 2026 dans l'ensemble de navigateurs de base et sont désormais disponibles dans la catégorie "Nouveautés de référence".
field-sizing
La propriété CSS field-sizing permet de contrôler le comportement de dimensionnement des éléments de formulaire (tels que <textarea>, <input> et <select>) qui ont traditionnellement des dimensions fixes par défaut. Les contrôles de formulaire field-sizing: content se développent ou se réduisent automatiquement pour s'adapter à leur contenu, ce qui réduit le besoin de scripts de redimensionnement automatique JavaScript personnalisés.
Pour en savoir plus, consultez la page de référence MDN sur field-sizing.
Fonctionnalités standards largement disponibles
Les fonctionnalités suivantes sont désormais largement disponibles dans Baseline, ce qui signifie qu'elles sont désormais largement compatibles et utilisables dans vos projets.
Pseudo-classe :has()
Le sélecteur parent CSS :has() vous permet de styliser un élément en fonction de ses descendants ou de ses frères et sœurs suivants. Cette pseudo-classe fonctionnelle permet des modèles de mise en page conditionnels directement en CSS, sans avoir besoin de JavaScript pour inspecter les structures DOM.
Pour en savoir plus, consultez la page MDN sur la pseudo-classe :has.
HTMLIFrameElement.loading
La propriété loading des éléments <iframe> permet le chargement différé des frames intégrés. En spécifiant loading="lazy", les navigateurs diffèrent le chargement des iFrames hors écran jusqu'à ce qu'ils soient proches de la fenêtre d'affichage, ce qui permet d'économiser de la bande passante réseau et de réduire la surcharge de chargement initial de la page.
Pour en savoir plus, consultez la documentation de référence MDN sur HTMLIFrameElement.loading.
CanvasRenderingContext2D.reset()
La méthode reset() sur les contextes de canevas 2D efface l'état du contexte de dessin, en rétablissant les valeurs par défaut des propriétés telles que les transformations, les chemins de découpage, les styles de ligne et les styles de remplissage. Cela permet de réutiliser un contexte de canevas de manière propre sans nettoyage manuel des propriétés.
Pour en savoir plus, consultez la documentation MDN sur CanvasRenderingContext2D.reset.
Unité de longueur cap
L'unité relative à la police cap correspond à la hauteur de majuscule nominale de la police de l'élément. Il vous permet d'aligner et de dimensionner les éléments par rapport à la hauteur des lettres majuscules, ce qui permet de créer des mises en page typographiques précises.
Pour en savoir plus, consultez la documentation MDN sur les unités de longueur.
counter-set établissement
La propriété CSS counter-set définit un compteur CSS sur une valeur spécifiée, en complément de counter-reset et counter-increment. Il permet de contrôler la manipulation des listes numérotées, des plans de document ou des séquences de compteurs personnalisées.
Consultez la page MDN pour counter-set.
createImageBitmap()
La méthode statique createImageBitmap() crée une image bitmap asynchrone à partir de diverses sources d'images, y compris <img>, <canvas>, Blob ou ImageData. Comme il décode les images en dehors du thread principal, il évite de bloquer les performances de l'UI lors de la gestion de graphiques de canevas complexes.
Consultez les détails de l'implémentation dans la documentation MDN pour createImageBitmap.
Type de données <easing-function>
Le type de données CSS <easing-function> décrit les courbes mathématiques de taux de variation pour les transitions et les animations. En plus des mots clés standards comme ease-in ou cubic-bezier(), il est compatible avec des fonctions comme linear() pour créer des effets de ressort ou de rebond personnalisés.
Découvrez comment l'utiliser dans la documentation de référence MDN sur les fonctions d'accélération.
Sélecteur d'imbrication &
Le sélecteur d'imbrication & ancre explicitement les sélecteurs de règles enfants à leur sélecteur parent lors de l'utilisation de l'imbrication CSS intégrée. Il garantit la clarté et la spécificité des règles lors de la définition des états imbriqués de survol, de focus ou de pseudo-classe.
Pour en savoir plus, consultez le guide MDN sur le sélecteur d'imbrication.
Préchargement adaptatif avec rel="preload"
L'attribut media des éléments <link rel="preload"> permet le préchargement réactif des éléments clés. En combinant rel="preload" avec des requêtes média, les navigateurs ne téléchargent que les éléments correspondant à la largeur de la fenêtre d'affichage ou aux caractéristiques d'affichage de l'utilisateur au début du cycle de vie du chargement.
Découvrez comment l'utiliser dans la documentation MDN sur rel="preload".
HTMLMediaElement.preservesPitch
La propriété preservesPitch des éléments <audio> et <video> contrôle si le navigateur ajuste la hauteur du son lorsque la propriété playbackRate est modifiée.
Si vous le définissez sur false, les changements de tonalité sont autorisés lorsque vous accélérez ou ralentissez la lecture du contenu multimédia.
Pour en savoir plus, consultez la page MDN sur HTMLMediaElement.preservesPitch.
Pseudo-classe :dir()
La pseudo-classe CSS :dir() correspond aux éléments en fonction de la direction du texte (comme ltr ou rtl), de la direction héritée des attributs HTML tels que dir ou du contexte de texte calculé.
Pour en savoir plus, consultez la page MDN sur la pseudo-classe :dir.
Fonction mathématique pow()
La fonction CSS pow() calcule les valeurs de puissance exponentielle directement dans les déclarations CSS, en élevant un nombre de base à un exposant (par exemple, pow(2, 3)). Cela simplifie la mise à l'échelle responsive et les relations mathématiques de la grille.
Pour en savoir plus, consultez la documentation de référence MDN sur la fonction pow.
Propriété CSS mask
La propriété raccourcie CSS mask masque des parties d'un élément à l'aide d'images ou de dégradés comme calques de découpage. Il combine des sous-propriétés telles que mask-image, mask-position et mask-repeat pour créer des effets de masquage visuels complexes.
Pour en savoir plus, consultez la page MDN sur la propriété mask.
@media (scripting)
La fonctionnalité média scripting permet de vérifier si le script côté client (tel que JavaScript) est activé et disponible dans le contexte du navigateur. Cela permet aux styles d'amélioration progressive de cibler les environnements avec ou sans JavaScript actif.
Pour en savoir plus, consultez la documentation MDN sur la fonctionnalité de script pour les éléments multimédias.
URL.canParse()
La méthode statique URL.canParse() vérifie si une chaîne donnée est une URL valide et analysable (avec une URL de base facultative) sans générer d'exception, ce qui simplifie la validation de l'URL au moment de l'exécution avant d'instancier des objets URL.
Consultez les détails de l'implémentation dans la documentation MDN pour URL.canParse.
API Storage Access
L'API Storage Access fournit un mécanisme permettant au contenu multisite intégré dans des <iframe> tiers de demander l'accès aux cookies et au stockage non partitionnés, ce qui permet l'authentification et les interactions avec état au-delà des limites de domaine.
Pour en savoir plus, consultez la page MDN sur l'API Storage Access.
Conclusion
Dites-nous si nous avons oublié quelque chose concernant Baseline. Nous veillerons à ce que cela soit inclus dans une prochaine édition. Si vous avez des questions ou souhaitez nous faire part de vos commentaires sur Baseline, vous pouvez signaler un problème dans notre Issue Tracker.