Autor Tema: Ejercicio CSS y HTML cómo afecta !important a los estilos en línea CU01017D (Leído 3217 veces)

mariobeitia · « **en:** 12 de Agosto 2015, 17:13 »

Enunciado:

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

.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é?

No se muestra borde para el div, ya que en la definición externa de css se marcó como !important, la propiedad hidden para el borde

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

Color Verde, por la misma razón que el borde, se marco como !important la propiedad color en el css externo.

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

Los valores width y height debrerían respetarse ya que no se estableció en la declaracion de linea ningún estilo alternativo.

Gracias por las correcciones.

Alex Rodríguez · « **Respuesta #1 en:** 14 de Agosto 2015, 15:27 »

Hola Mario, todas las respuestas correctas

Se puede comprobar que aunque el texto no cabe en el ancho definido, las palabras se muestran excediendo el ancho disponible

Código: [Seleccionar]

<!DOCTYPE html>
<head>
<style>
     .magicTitle {
margin:0px;
width:10px;
height:30px;
color:green !important;
border-style: hidden !important;
}
</style>
</head>
<body> 
<div class="magicTitle" style="border:1px solid blue; color: blue;">
Aprendiendo a programar
</div>
</body>
</html>

Saludos

mariobeitia · « **Respuesta #2 en:** 14 de Agosto 2015, 15:32 »

Muchas Gracias!!

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias: