Foros aprenderaprogramar.com
Aprender a programar => Aprender a programar desde cero => Mensaje iniciado por: hymsoft en 15 de Septiembre 2016, 19:55
-
Buenas buenas!!!! dejo mi código para la resolución del ejercicio CU01041D del curso básico de programación CSS para desarrollos web.
Saludos!!!! a todos...
CU01041D.html
<!DOCTYPE html>
<html lang="es">
<head>
<title>CSS Efecto sombra</title>
<meta name="author" content="Hugo A. Segura" />
<meta name="description" content="Efecto sombra - shadow y blur" />
<meta name="keywords" content="curso, aprender a programar, html, css, text-shadow, blur(CU01041D)" />
<meta charset="utf-8" />
<meta name="robots" content="index, follow" />
<link rel="stylesheet" type="text/css" href="CU01041D.css"/>
</head>
<body>
<div id="div1">Lorem <span id="somb1">ipsum dolor</span> sit amet, consectetur adipisicing elit. In sunt vel molestiae facere veritatis tenetur molestias eveniet, sit cumque. Voluptatibus tenetur rerum incidunt, labore veritatis beatae. Totam quidem, natus alias. Officiis excepturi tempora, deleniti dignissimos odit voluptas odio corrupti dolorum doloribus quam quisquam, incidunt ea aut harum quidem earum impedit possimus reiciendis pariatur eveniet praesentium nam. Fugit vel veniam autem? Expedita soluta excepturi libero animi est illo labore reiciendis, necessitatibus eos? Similique, eos. Vitae voluptatibus, adipisci, quos autem animi quo odio aut dolore a illo amet et suscipit magni. Officiis.</div>
<div id="div2">Lorem ipsum dolor sit amet, consectetur adipisicing elit. In sunt vel molestiae facere veritatis tenetur molestias eveniet, sit cumque. <span id="somb2">Voluptatibus tenetur rerum incidunt</span>, labore veritatis beatae. Totam quidem, natus alias. Officiis excepturi tempora, deleniti dignissimos odit voluptas odio corrupti dolorum doloribus quam quisquam, incidunt ea aut harum quidem earum impedit possimus reiciendis pariatur eveniet praesentium nam. Fugit vel veniam autem? Expedita soluta excepturi libero animi est illo labore reiciendis, necessitatibus eos? Similique, eos. Vitae voluptatibus, adipisci, quos autem animi quo odio aut dolore a illo amet et suscipit magni. Officiis.</div>
<div id="div3">Lorem ipsum dolor sit amet, consectetur adipisicing elit. In sunt vel molestiae facere veritatis tenetur molestias eveniet, sit cumque. <span id="somb3">Voluptatibus tenetur rerum incidunt</span>, labore veritatis beatae. Totam quidem, natus alias. Officiis excepturi tempora, deleniti dignissimos odit voluptas odio corrupti dolorum doloribus quam quisquam, incidunt ea aut harum quidem earum impedit possimus reiciendis pariatur eveniet praesentium nam. Fugit vel veniam autem? Expedita soluta excepturi libero animi est illo labore reiciendis, necessitatibus eos? Similique, eos. Vitae voluptatibus, adipisci, quos autem animi quo odio aut dolore a illo amet et suscipit magni. Officiis.</div>
</body>
</html>
CU01041D.css
/* Hoja de estilo para el ejercicio CU01041D */
/* Estilos comunes para toda la pagina */
*{font-family: arial;}
div {
width: 240px;
height: 300px;
margin: 18px;
padding: 8px;
border: solid 3px;
float: left;
border-color: blue;}
span {font-size: 18px;}
/* Estilos especificos */
#div1{
overflow: hidden;
white-space:nowrap;
text-overflow:ellipsis;
line-height: 1.05;
}
#div2 {
line-height: 1.1;
overflow:hidden;
}
#div3{
text-align: justify;
line-height: 1.2;
color: #8B4513;
}
#somb1 { text-shadow: 1px 1px red; }
#somb2 { text-shadow: -1px 1px blue; }
#somb3 { text-shadow: 4px 4px 10px green,-4px -4px 10px green;}
-
Hola hymsoft.
Tu ejercicio hace todo lo que se pedía. Así que a por el siguiente.
Destacar tu buena estructuración del código, de esa manera es mucho mas fácil leerlo.
Saludos. ;D