Buenas buenas!!!
Les dejo código html para el ejercicio de la entrega número CU01026D del programa formativo en programación web con CSS desde cero.
Aunque para este ejercicio sirve, podría alguno indicarme la forma correcta de armar el CSS sin tener que usar múltiples id???. Porque de la forma que yo lo hice (que estoy casi casi seguro esta mal), agregando cualquier cosas en cualquier lado antes de el ultimo DIV, hace que toda la pagina ya no funcione de forma correcta.
Gracias!!!!
CU01026D.html
<!DOCTYPE html>
<html lang="es">
<head>
<title>Tipos de Bordes - curso aprenderaprogramar.com</title>
<meta name="author" content="Hugo A. Segura" />
<meta name="description" content="Tipos de bordes CSS - aprenderaprogramar.com" />
<meta name="keywords" content="bordes CSS, CSS, cursos, ejemplos, aprenderaprogramar.com,CU01026D" />
<meta charset="utf-8" />
<meta name="robots" content="index, follow" />
<link rel="stylesheet" type="text/css" href="CU01026D.css"/>
</head>
<body>
<div>Div 1 - border-style: dashed</div>
<br/><br/>
<div>Div 2 - border-style: dotted</div>
<br/><br/>
<div>Div 3 - border-style: double</div>
<br/><br/>
<div>Div 4 - border-style:groove</div>
<br/><br/>
<div>Div 5 - border-style:inset</div>
<br/><br/>
<div>Div 6 - border-style: solid</div>
<br/><br/>
<div>Div 7 - border-style: ridge</div>
<br/><br/>
<div>Div 8 - border-style: outset</div>
<br/><br/>
<div>Div 9 - border-left-style: dashed;border-top-style: dotted; border-right-style: double;border-bottom-style: solid</div>
<br/><br/>
<div>Div 10 - border-top-style: dotted;border-bottom-style:dotted</div>
<br/><br/>
</body>
</html>
CU01026D.css
/* Estilos aplicados al ejercicio entrega N1 26
aprenderaprogramar.com (CU01023D)*/
html{
text-align: center;
background-color: aquamarine;
}
div{
font-size: 1.2em;
}
div:nth-child(1){border-style: dashed;}
div:nth-child(4){border-style: dotted;}
div:nth-child(7){border-style: double;}
div:nth-child(10){border-style:groove;}
div:nth-child(13){border-style:inset;}
div:nth-child(16){border-style: solid;}
div:nth-child(19){border-style: ridge;}
div:nth-child(22){border-style: outset;}
div:nth-child(25){border-left-style: dashed;border-top-style: dotted; border-right-style: double;border-bottom-style: solid;}
div:nth-child(28){border-top-style: dotted;border-bottom-style:dotted;}