Buenas buenas!!!!
Dejo mi ejercicio para la entrega numero CU01027D del curso de fundamentos de programación web con CSS. Ya que la idea de CSS es cambiar la hoja de estilo tratando de no tocar el HTML, solo hice 1 html y 2 hojas de estilo, aunque en este caso no cambia nada visualmente, jajajajaja, pero ya llegaremos a eso!!!!
saluto a tutti e buona vita
CU01027D.html
<html lang="es">
<head>
<title>Notación CSS abreviada - curso aprenderaprogramar.com</title>
<meta name="author" content="Hugo A. Segura" />
<meta name="description" content="Notacion CSS abreviada - 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="CU01027Dejer1.css"/>
</head>
<body>
<div id="contenedor">
<div id="div01">Div 1</div>
<br/><br/>
<div id="div02">Div 2</div>
</div>
</body>
</html>
CU01027Dejer1.css
/* Estilos aplicados al ejercicio entrega N1 26
aprenderaprogramar.com (CU01027D) ejercicio 1*/
html{
text-align: center;
background-color: aquamarine;
}
#contenedor{
font-size: 1.2em;
height: 400px;
}
#div01{
height: 50%;
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;
}
#div02{
height: 50%;
border-top-style:inset; border-top-width:30px; border-top-color:#B22222;
border-right-style:solid; border-right-width:22px; border-right-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;
}
CU01027Dejer2.css
/* Estilos aplicados al ejercicio entrega N1 26
aprenderaprogramar.com (CU01023D) ejercicio 2*/
html{
text-align: center;
background-color: aquamarine;
}
#contenedor{
font-size: 1.2em;
height: 400px;
}
#div01{
height: 50%;
border-top:dotted 10px #00FF00;
border-right:dashed 20px #0000FF;
border-bottom:double 10px #A52A2A;
border-left:groove 30px #2F4F4F;
}
#div02{
height: 50%;
border-top:inset 30px #B22222;
border-right:solid 22px #DAA520;
border-bottom:double 25px #4B0082;
border-left:dotted 17px #808000;
}