Maison >interface Web >tutoriel CSS >« all : unset » et « all : revert » : quand devez-vous utiliser chacun ?

« all : unset » et « all : revert » : quand devez-vous utiliser chacun ?

DDD
DDDoriginal
2024-11-10 18:29:02390parcourir
<p>  `all: unset` vs. `all: revert`: When Should You Use Each?

<p>Les nuances du CSS : all : unset vs. all : revert

<p>Comprendre les subtilités entre les mots-clés CSS peut élever vos capacités de style. Dans le cas de all: unset et all: revert, la distinction réside dans leur traitement des feuilles de style appliquées par le navigateur et définies par l'utilisateur.

<p>all: unset

<p>Comme indiqué dans MDN, unset vous permet de réinitialiser une propriété soit à sa valeur héritée si elle est héritée de son parent, soit à sa valeur initiale sinon. Par conséquent, il émule le mot-cléherit dans le premier scénario et le mot-cléinitial dans le second.

<p>all : revert

<p>En revanche, revert rétablit la valeur en cascade d'une propriété à son état n'avait aucune modification apportée à l'élément actuel. Cela signifie qu'il réinitialise la propriété à sa valeur héritée, ou s'il n'en existe aucune, à la valeur par défaut définie par la feuille de style du navigateur ou tout style utilisateur applicable.

<p>Différences clés

<p>La distinction principale apparaît lorsque le navigateur applique des styles par défaut à un élément. En utilisant Revert, vous annulez efficacement ces styles, contrairement à la suppression.

<p>Illustration

<p>Considérez l'extrait de code HTML et CSS suivant :

<p>
<p>Supposons que le navigateur définit automatiquement une marge par défaut de 50 px sur <p> éléments. Dans ce cas, le texte dans le paragraphe avec margin:revert verra sa marge réinitialisée à 0px, supprimant ainsi le style par défaut du navigateur. En revanche, le texte du paragraphe avec margin:unset conservera la marge par défaut du navigateur de 50 px.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn