Foros aprenderaprogramar.com
Aprender a programar => C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más => Mensaje iniciado por: JurreNawijn en 20 de Enero 2016, 14:45
-
Buenos días, dejo la posible solución a este ejercicio.
HTML:
<html>
<head>
<title>Ejemplo aprenderaprogramar.com</title>
<meta charset="utf-8">
<style type="text/css">
<!-- El código CSS está en la pestaña de abajo -->
</style>
</head>
<body>
<div id="div1">
<P>El div 1 debe contener un texto suficientemente largo, con numerosos párrafos, como para exceder el tamaño del contenedor. El texto del html debe transformarse completamente a mayúsculas mediante el uso de propiedades CSS. La separación entre letras debe ser un 5% superior a lo normal. La primera letra de cada párrafo debe tener un tamaño un 250% lo normal. Relleno Relleno Relleno Relleno Relleno Relleno Relleno Relleno Relleno Relleno Relleno</P>
</div>
<div id="div2">
<p> El div 2 debe contener un TEXTO SUFICIENTEMENTE largo como para exceder el tamaño del contenedor. El texto del html debe transformarse completamente a minúsculas mediante el uso de propiedades CSS. La separación entre letras debe ser un 10% superior a lo normal. Debe contener una palabra (cadena de texto cualquiera) de gran longitud, de modo que no quepa en el contenedor, y “romperse” para no exceder la capacidad del contenedor usando la propiedad word-wrap.</p>
</div>
<div id="div3">
<p>El div 3 debe contener un texto suficientemente largo como para exceder el tamaño del contenedor. Aprenderaprogramar.com El texto del html debe transformarse para que toda palabra comience con una letra mayúscula mediante el uso de propiedades CSS. La separación entre palabras debe ser un 10% superior a lo normal. Debe contener una palabra (cadena de texto cualquiera) de gran longitud, de modo que no quepa en el contenedor, y no romperse.</p>
</div>
</body>
</html>
CSS:
* {padding: 0; margin: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing:border-box;}
div {width: 180px; height:300px; margin:33px; border: 6px solid red; display: inline-block; vertical-align:top;}
#div1 {text-transform:uppercase; word-spacing: 5px; }
#div1 p:first-letter {font-size: 250%;}
#div2 {text-transform: lowercase; letter-spacing: 10px; word-wrap: break-word;}
#div3 {letter-spacing: 10px;}
#div3 p:first-letter {text-transform: uppercase;}
-
Buenas JurreNawijn
Como se comenta en otros hilos recomendamos cerrar los tags que no llevan un cierre explícito por ejemplo en lugar de <meta charset="utf-8"> usar <meta charset="utf-8"/> esto es solo para cumplir el estándar xhtml.
De lo que pedía el ejercicio lo único que veo que falte es en el div 3 " El texto del html debe transformarse para que toda palabra comience con una letra mayúscula mediante el uso de propiedades CSS" para ello te faltaría añadir la propiedad css text-transform: capitalize;
Salu2