Autor Tema: HTML crear un borde punteado o a trazos Shortand notación CSS abreviada CU01027D (Leído 4048 veces)

Lorenzo31 · « **en:** 15 de Febrero 2016, 18:18 »

Buenas, dejo la solución a mi ejercicio CU01027D.

EJERCICIO 1

<!DOCTYPE html>
<html>
	<head><meta charset="utf-8"/>
		 <link rel="stylesheet" type="text/css" href="estilos127D.css"
	</head>
	<body>
	     <div>DIVISIÓN 1</div>
		 <br/><br/>
		 <div id="segunda">DIVISIÓN 2</div>
	</body>
</html>

estilos127D.css

Código: [Seleccionar]

html, body { height:100%; }
div { height:40%; text-align:center; }
/*Primera división*/
div:nth-child(1){ border-top-style:dotted; border-top-width:10px; border-top-color:#00FF00;
		  border-right-style:dashed; border-right-width:20px; border-right-color:#0000FF;
		  border-bottom-style:double; border-bottom-width:10px; border-bottom-color:#A52A2A;
		  border-left-style:groove; border-left-width:30px; border-left-color:#2F4F4F; }
/*Segunda división*/
#segunda { border-top-style:inset; border-top-width:30px; border-top-color:#B22222;
		  border-right-style:solid; border-right-width:22px; border-rigth-color:#DAA520;
	 	  border-bottom-style:double; border-bottom-width:25px; border-bottom-color:#4B0082;
		  border-left-style:dotted; border-left-width:17px; border-left-color:#808000; }

EJERCICIO2

Código: [Seleccionar]

<!DOCTYPE html>
<html>
	<head><meta charset="utf-8"/>
		 <link rel="stylesheet" type="text/css" href="estilos127Dabreviados.css"
	</head>
	<body>
	     <div>DIVISIÓN 1</div>
		 <br/><br/>
		 <div id="segunda">DIVISIÓN 2</div>
	</body>
</html>

estilos127Dabreviados.css

Código: [Seleccionar]

html, body { height:100%; }
div { height:40%; text-align:center; }
/*Primera división*/
div:nth-child(1){ border-style:dotted dashed double groove; 
		  border-width:10px 20px 10px 30px; 
	          border-color:#00FF00 #0000FF #A52A2A #2F4F4F; }
/*Segunda división*/
#segunda { border-style:inset solid double dotted;
	   border-width:30px 22px 25px 17px;
	   border-color:#B22222 #DAA520 #4B0082 #808000; }

Mario R. Rancel · « **Respuesta #1 en:** 17 de Febrero 2016, 21:12 »

Buenas tardes, todo correcto en la aplicación de estilos de bordes tanto en el ejercicio 1 como en el ejercicio 2.

Repito lo ya comentado sobre html, body {height:100%}: no es habitual aplicar una regla html, body (aunque puedes usarla ya que no hay nada que te lo impida, pero hasta cierto punto se verá como redundante. No es común aplicar reglas al elemento html).

Otra cosa que no es habitual es aplicar un valor de height:100% al body. El valor de altura en el body no se suele establecer, quedando la altura determinada por los contenidos de la propia página.

Saludos

Lorenzo31 · « **Respuesta #2 en:** 17 de Febrero 2016, 23:17 »

Si, gracias Mario, ya no lo repetire supongo que al hacer pruebas si algo no queda como me gusta en pantalla, usaba eso del height 100% para body, pero ya no lo usaré más y recurriré a comprender mejor el resto de cosas que haga ( que será donde esté el problema seguro jeje )

Gracias Mario.

hymsoft · « **Respuesta #3 en:** 20 de Agosto 2016, 14:27 »

Buenas buenas!!! Mi nombre es Hugo, y también estoy aprendiendo. Revisando tu ejercicio me di cuenta que aqui

#segunda {...
border-right-style:solid; border-right-width:22px; border-rigth-color:#DAA520;
... }

esta mal escrito, por lo tanto, no se aplica el color que le pones.

Creo que usas html, body { height:100%; } para que div { height:40%; text-align:center; } funcione, ya que el height funciona solo si el contenedor padre no esta en Auto. Yo para no declarar eso en el html ni el body, uso un div como contenedor (por lo menos es lo que hasta aqui aprendí) y a ese div le doy la medida

Saludos gente y a seguir aprendiendo!!!!

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

Noticias:

Autor Tema: HTML crear un borde punteado o a trazos Shortand notación CSS abreviada CU01027D (Leído 4048 veces)

Lorenzo31

HTML crear un borde punteado o a trazos Shortand notación CSS abreviada CU01027D

Mario R. Rancel

Re:Shortand: notación CSS abreviada. CU01027D

Lorenzo31

Re:HTML crear un borde punteado o a trazos Shortand notación CSS abreviada CU01027D

hymsoft

Re:HTML crear un borde punteado o a trazos Shortand notación CSS abreviada CU01027D

Preguntas y respuestas