Les valeurs CSS peuvent-elles être attribuées directement à l'aide des attributs de données HTML5 ?

Accès aux valeurs CSS avec les attributs de données HTML5

En CSS, il est possible de récupérer les valeurs des attributs de données HTML5 à l'aide de la fonction attr(). Cette fonctionnalité peut être utile pour contrôler les propriétés CSS de manière dynamique en fonction des informations stockées dans le balisage HTML.

Cependant, attribuer des valeurs CSS directement à l'aide d'attributs de données était auparavant impossible. Pour déterminer si cette fonctionnalité a été implémentée, le code CSS suivant peut être inspecté :

<code class="css">width: attr(data-width);</code>

Ce code tente de définir la propriété width d'un élément en fonction de la valeur de l'attribut data-width. Si la fonctionnalité est prise en charge, la largeur doit refléter la valeur spécifiée dans le HTML.

Dans l'exemple HTML fourni :

<code class="html"><div data-width="600px"></div></code>

La propriété width doit s'étendre à 600 pixels si le navigateur prend en charge utiliser des attributs de données pour attribuer des valeurs CSS. Cependant, l'implémentation actuelle des principaux navigateurs ne prend pas en charge cette fonctionnalité.

Heureusement, la possibilité d'accéder aux valeurs CSS à partir des attributs de données est spécifiée dans le projet des valeurs CSS3. En conséquence, une prise en charge complète est attendue dans les futures versions du navigateur.

Il convient de noter que l'utilisation d'attributs de données pour récupérer le contenu des pseudo-éléments est actuellement fonctionnelle, même si elle n'est pas encore largement prise en charge pour l'attribution de valeurs CSS.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!