Array

Qué hace !importante media en CSS?

-

Una de las mejores formas de aprender a codificar sitios web es mirar los códigos fuente de otros sitios. Esta práctica es la cantidad de profesionales de la web que aprendieron su oficio, especialmente en los días previos a que hubiera tantas opciones para cursos de diseño web, libros y sitios de capacitación en línea.

Si prueba esta práctica y mira las hojas de estilo en cascada de un sitio y amp; apos; s, una cosa que puede ver en ese código es una línea que dice !importante . Este término cambia la prioridad de procesamiento dentro de la hoja de estilo.

CSS coding
CSS coding
& lt; / img & gt ;
E + / Getty Images

La cascada de CSS

Las hojas de estilo en cascada hacen cascada , lo que significa que se colocan en un orden particular. En general, los estilos se aplican en el orden en que el navegador los lee. Se aplica el primer estilo y luego el segundo, y así sucesivamente.

Video destacado

Como resultado, & amp; amp; nbsp; si un estilo aparece en la parte superior de una hoja de estilo y luego se cambia más abajo en el documento, la segunda instancia de ese estilo es & amp; amp; nbsp; el aplicado & amp; amp; nbsp; en instancias posteriores, no la primera. Básicamente, si dos estilos dicen lo mismo (lo que significa que tienen el mismo nivel de especificidad), se utilizará el último en la lista.

Por ejemplo, let & amp; apos; s imagina que los siguientes estilos estaban contenidos en una hoja de estilo. El texto del párrafo se representaría en negro, aunque la primera propiedad de estilo aplicada sea roja. Esto se debe a que & amp; quot; black & amp; quot; el valor aparece en segundo lugar. Dado que CSS se lee de arriba a abajo, el estilo final es & amp; quot; black & amp; quot; y por lo tanto ese gana.

& lt; pre & gt; p {color: rojo; } & lt; br & gt ;
p {color: negro; } & lt; / br & gt;

& lt; / pre & gt ;

Cómo !importante cambia la prioridad

El !La directiva importante afecta la forma en que su CSS cae en cascada mientras sigue & amp; amp; nbsp; las reglas que considera son las más cruciales y deben aplicarse. Una regla que tiene esta & amp; amp; nbsp; directive siempre se aplica sin importar dónde aparezca esa regla en el documento CSS.

Para que el texto del párrafo sea siempre rojo, del ejemplo anterior, cambie el estilo de la siguiente manera:

& lt; pre & gt; p {color: rojo !importante; } & lt; br & gt ;
p {color: negro; } & lt; / br & gt;

& lt; / pre & gt ;

Ahora todo el texto aparecerá en rojo, aunque el & amp; quot; black & amp; quot; el valor aparece en segundo lugar. Los !La directiva importante anula las reglas normales de la cascada y le da a ese estilo una especificidad muy alta.

Si absolutamente necesitara que los párrafos parecieran rojos, este estilo lo haría, pero eso no significa que sea una buena práctica.

Cuándo usar !importante

Los !Una directiva importante es útil cuando está probando y depurando un sitio web. Si no está seguro de por qué no se aplica un estilo y cree que puede ser un conflicto de especificidad, agregue el !declaración importante a su estilo para ver si eso lo arregla & amp; # x2014; y si lo hace, cambie el orden de los selectores y elimine el !directivas importantes de su código de producción.

Si te apoyas demasiado en el !declaración importante para lograr los estilos deseados, eventualmente tendrá una hoja de estilo llena de basura !estilos importantes. Cambiará fundamentalmente la forma en que se procesa CSS de page & amp; apos; s. Es una práctica perezosa que no es buena desde el punto de vista de la gestión a largo plazo.

Utilizar !importante para las pruebas o, en algunos casos, cuando debe anular absolutamente un estilo en línea que forma parte de un marco de tema o plantilla. Incluso en esos casos, use este enfoque con moderación y en su lugar escriba hojas de estilo limpias que honren la cascada.

Hojas de estilo de usuario

Esta directiva también se estableció para ayudar a los usuarios de páginas web a hacer frente a las hojas de estilo que les dificultan el uso o la lectura de páginas.

Cuando alguien define una hoja de estilo para ver páginas web, esa hoja de estilo es anulada por la hoja de estilo del autor de la página y amp; apos; s. Si el usuario marca un estilo como & amp; amp; nbsp ;!importante, & amp; amp; nbsp; ese estilo anula la hoja de estilo del autor de la página web & amp; apos; s, incluso si el autor marca una regla como & amp; amp; nbsp ;!importante.

Esta jerarquía es útil para los usuarios que necesitan establecer estilos de cierta manera. Por ejemplo, un lector con discapacidad visual puede necesitar aumentar los tamaños de fuente predeterminados en todas las páginas web que usa. Al usar tu !directiva importante con moderación dentro de las páginas que construye, acomoda a sus lectores y amplificadores; Apos; necesidades únicas.

& amp; # x203A; Informática

Dejar respuesta

Please enter your comment!
Please enter your name here

FOLLOW US

spot_img

Related Stories