Significado de declaración !important en CSS prevalencia en colisiones CU01017D

[EnigmaticNerd]

Buenas tardes. Este es el enunciado del ejercicio CU01017D del manual de programación web con CSS desde cero:

En el archivo CSS externo a un documento HTML encontramos esta declaración:

Código: [Seleccionar]

.magicTitle {

margin:0px;

width:20px;

height:30px;

color:green !important;

border-style: hidden !important;
}


Por otro lado dentro del código HTML tenemos el siguiente código:

Código: [Seleccionar]

<div class="magicTitle" style="border:1px solid blue; color: blue;">

Aprendiendo a programar
</div>


Responde a las siguientes preguntas:

a) ¿Se mostrará un borde para el div? ¿Por qué?

b) ¿Con qué color se mostrará el texto, con color verde o con color azul? ¿Por qué?

c) ¿Se respetarán los valores de width y height definidos en el archivo CSS externo o quedarán anulados? ¿Por qué?

Respuestas

A.)No. El estilo externo tiene la propiedad border-style acompañada de la palabra clave !important en su declaración, esto anula la precedencia de origen del estilo en línea. Además, la propiedad border-style tiene el valor hidden el cual oculta el elemento al usuario.

B.)Se mostrará con color verde. Aunque las propiedades tienen igual nivel de importancia, es la del archivo externo la que precede por tener !important en su declaración.

C.)Se respetan los valores dado que no se suscita colisión de estilos con el documento HTML.

[Alex Rodríguez]

Hola EnigmaticNerd, ejercicio bien resuelto. Por favor para poner el título de los temas guíate por lo que se dice en https://www.aprenderaprogramar.com/foros/index.php?topic=1460.0

En lugar de Ejercicio CU01017D de Aprender a programar:CSS desde cero. Cascada, !important es preferible empezar poniendo una descripción y palabras clave y terminar con el código del ejercicio, por ejemplo: significado de declaración !important en CSS prevalencia en colisiones CU01017D

Saludos