Maison > interface Web > tutoriel CSS > le corps du texte

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

DDD
Libérer: 2024-11-10 18:29:02
original
358 Les gens l'ont consulté
<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>
Copier après la connexion
<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!

source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal