Dominando el Arte de Restablecer Estilos

Introducción

En este laboratorio, exploraremos el concepto de restablecer todos los estilos a sus valores predeterminados utilizando la propiedad all. Al final de este laboratorio, tendrás una comprensión clara de cómo utilizar esta propiedad para restablecer todos los estilos, tanto heredados como no heredados, a sus valores originales. Esto te permitirá restablecer rápidamente y fácilmente el estilo de un elemento sin tener que restablecer cada propiedad por separado.

Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL css(("CSS")) -.-> css/BasicConceptsGroup(["Basic Concepts"]) css/BasicConceptsGroup -.-> css/selectors("Selectors") subgraph Lab Skills css/selectors -.-> lab-35233{{"Restablecer todos los estilos"}} end

Restablece todos los estilos

index.html y style.css ya se han proporcionado en la máquina virtual.

Para restablecer todos los estilos a sus valores predeterminados, utiliza la propiedad all. Esta propiedad no afectará a las propiedades direction y unicode-bidi. Aquí hay un ejemplo de cómo utilizarla:

<div class="reset-all-styles">
  <h5>Título</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;
}

Haga clic en 'Go Live' en la esquina inferior derecha para ejecutar el servicio web en el puerto 8080. Luego, puede actualizar la pestaña Web 8080 para previsualizar la página web.

Resumen

¡Felicitaciones! Has completado el laboratorio de Restablecer todos los estilos. Puedes practicar más laboratorios en LabEx para mejorar tus habilidades.