What does "revert" do in CSS?

Miriamsuzanne explique dans une vidéo de développeur de Mozilla sur le sujet.

La valeur de retour dans CSS «réinitialise» une propriété à sa valeur héritée, ne remonte que la feuille de style UA. C'est essentiel, car il ne réinitialisera pas un

à l'inline, par exemple, car un

est un élément de niveau bloc tel que défini dans la feuille de style UA.

Donc, si nous avions ce HTML:

 <p> lorem, ipsum Dolor. </p>
<p> fugit, id vel. </p>

Et CSS:

 p {
  Couleur: rouge;
}
.alt {
  Couleur: retourner;
}

Les deux paragraphes seraient sélectionnés par le sélecteur P, ce qui les rend rouges, mais le sélecteur de classe du deuxième paragraphe a une spécificité plus élevée, donc la couleur: recommencer; gagne, changeant le texte en noir (la valeur par défaut UA).

Mais, la propriété Color Cascades, donc si nous avions:

 <div>
  <p> lorem, ipsum Dolor. </p>
  <p> fugit, id vel. </p>
</div>

 .parent {
  Couleur: bleu;
}
p {
  Couleur: rouge;
}
.alt {
  Couleur: retourner;
}

Le deuxième paragraphe serait bleu parce que REVERT le force à retirer sa couleur de l'héritage.

La valeur de retour est assez nouvelle, soutenue dans Firefox et Safari, mais pas encore dans le monde Chrome. Nous avons déjà quelques mots clés connexes qui fonctionnent sur toute propriété destinée à aider à contrôler les valeurs de l'héritage et de réinitialisation.

La différence est petite, mais importante: unset permet l'héritage, tandis que le premier ne le fait pas.

Miriam fait valoir que REVERT est en fait les plus utiles d'entre eux car il «prend des styles d'utilisateur et d'agent utilisateur.

Je ne suis pas en désaccord. Mais (et je déteste dire ceci) Je pense que nous avons besoin d'une quatrième option, qui a le pouvoir de forçage de l'initiale, mais le respect de la feuille de style UA de REVERT. Quelque chose comme…

 .bouton {
  tout: par défaut; / * Pas réel! * /

  / * Nouveaux styles à partir de la base UA * /
}

Ces mots clés fonctionnent avec n'importe quelle propriété, mais je pense que l'utilisation de tous est la plus convaincante. C'est une façon d'effacer tous les styles sur un élément pour commencer avec une ardoise vierge. Cela dit, aucune des trois options n'est assez bonne pour ce cas d'utilisation. Les valeurs non set et retourne ne sont pas assez bonnes car elles permettent toujours l'héritage et n'échappent donc pas assez bien les styles. La valeur initiale est trop forte en ce qu'elle efface les valeurs par défaut auxquelles vous pourriez ne pas vous attendre, comme faire un

en ligne au lieu d'un bloc.

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!