Maîtriser l'art de la réinitialisation de styles

Introduction

Dans ce laboratoire, nous allons explorer le concept de réinitialisation de tous les styles à leurs valeurs par défaut en utilisant la propriété all. À la fin de ce laboratoire, vous aurez une compréhension claire de la manière d'utiliser cette propriété pour réinitialiser tous les styles, hérités et non hérités, à leurs valeurs d'origine. Cela vous permettra de réinitialiser rapidement et facilement le style d'un élément sans avoir à réinitialiser individuellement chaque propriété.

Ceci est un Guided Lab, qui fournit des instructions étape par étape pour vous aider à apprendre et à pratiquer. Suivez attentivement les instructions pour compléter chaque étape et acquérir une expérience pratique. Les données historiques montrent que c'est un laboratoire de niveau débutant avec un taux de réussite de 100%. Il a reçu un taux d'avis positifs de 96% de la part des apprenants.

Réinitialiser tous les styles

index.html et style.css ont déjà été fournis dans la machine virtuelle.

Pour réinitialiser tous les styles à leurs valeurs par défaut, utilisez la propriété all. Cette propriété n'affectera pas les propriétés direction et unicode-bidi. Voici un exemple de manière à l'utiliser :

<div class="reset-all-styles">
  <h5>Titre</h5>
  <p>
    Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure id
    exercitationem nulla qui repellat laborum vitae, molestias tempora velit
    natus. Quas, assumenda nisi. Quisquam enim qui iure, consequatur velit sit?
  </p>
</div>

.reset-all-styles {
  all: initial;
}

Veuillez cliquer sur 'Go Live' dans le coin inférieur droit pour exécuter le service web sur le port 8080. Ensuite, vous pouvez actualiser l'onglet Web 8080 pour prévisualiser la page web.

Sommaire

Félicitations ! Vous avez terminé le laboratoire Réinitialiser tous les styles. Vous pouvez pratiquer d'autres laboratoires sur LabEx pour améliorer vos compétences.