Autor Tema: HTML y CSS Text-Align - Color - White-Space mantener saltos de línea CU01040D  (Leído 2838 veces)

hymsoft

  • Intermedio
  • ***
  • Mensajes: 103
  • hymsoft
    • Ver Perfil
Buenas buenas!!! Dejo mi solucion al ejercicio CU01040D del curso de programación web con CSS.

Noto
« Última modificación: 21 de Septiembre 2016, 20:52 por Alex Rodríguez »
"Una persona inteligente es aquel que sabe ser tan inteligente como para contratar gente mas inteligente que el"

pedro,,

  • Moderador Global
  • Experto
  • *******
  • APR2.COM
  • Mensajes: 1292
    • Ver Perfil
Re:Text-Aling - Color - White-Space (CU01040D)
« Respuesta #1 en: 16 de Septiembre 2016, 01:10 »
Hola hymsoft.

¿el ejercicio? ::)

Saludos.

hymsoft

  • Intermedio
  • ***
  • Mensajes: 103
  • hymsoft
    • Ver Perfil
Re:Text-Aling - Color - White-Space (CU01040D)
« Respuesta #2 en: 16 de Septiembre 2016, 02:33 »
Buenas Pedro,la verdad no se que paso con el mensaje  :P .

voy a tratar de recordar lo que escribi antes, jajajajaja.

Lo que me paso con este ejercicio es lo siguiente: Aunque parece que todo lo hice correcto, nada me funciona como deberia. He visto los otros post, pero no puedo dar con el resultado deseado, lo que yo noto es que en esta consigna:
Citar
c) El div 2 debe tener alineación del texto a la derecha, color de texto #008080. Debe contener un texto suficientemente largo, con algunas palabras subrayadas por encima y el primer párrafo indentado en 50 píxeles. Este div estará definido en el HTML como un texto con saltos de línea definidos en ciertos puntos. Al mostrarse por pantalla, deben usarse propiedades CSS para se mantengan los saltos de línea definidos en el documento HTML, se colapsen secuencias de espacios en blanco y se usen espacios en blanco para generar nuevas líneas si es necesario

Mi texto esta alineado a la derecha, pero cuando lo indento con 50px se va una linea para abajo... Eso es porque llega al margen del DIV, sigue agregando espacios y despues alinea a la derecha???

y en esta...
Citar
El div 3 debe tener alineación del texto justificada, color de texto #8B4513. Debe contener un texto suficientemente largo, con algunas palabras tachadas, y el primer párrafo indentado en un 20%. Además el texto contendrá una frase donde existan 15 espacios en blanco seguidos, y dichos espacios deben mostrarse cuando se visualice el texto (si coincide con un borde del contenedor deberán continuar en una nueva línea).

pues ni modo... no consigo que se vean los 15 espacios agregados entre las palabras numeroso y paises del segundo parrafo. Ayuda!!!! jajajajajaj

aca si el codigo

CU01040D.html
Código: [Seleccionar]
<!DOCTYPE html>
<html lang="es">
  <head>
    <title>Diseño web CSS - Curso aprenderaprogramar.com</title>
    <meta name="author" content="Hugo A. Segura" />
    <meta name="description" content="Text-aling" />
    <meta name="keywords" content="curso, aprender a programar, html, css, text-align,text-decoration,(CU01040D)" />   
    <meta charset="utf-8" />
    <meta name="robots" content="index, follow" />
    <link rel="stylesheet" type="text/css" href="CU01040D.css"/>
  </head>
  <body>
    <div id="div1"><span class="subrayado">
        Pink Floyd</span> fue una banda de rock británica, considerada un icono cultural del siglo XX y una de las bandas más influyentes en la historia de la música, que obtuvo gran popularidad gracias a su <span class="subrayado">música psicodélica</span> que evolucionó hacia el rock progresivo con el paso del tiempo.
        Es conocido por sus canciones de alto contenido filosófico, la experimentación sónica, las innovadoras portadas de sus discos y sus elaborados espectáculos en vivo. Sus ventas sobrepasan los más de <span class="subrayado">300 millones de álbumes vendidos</span> en todo el mundo, 97,5 de ellos solamente en los Estados Unidos.
       
        Formada en 1965, Inicialmente el grupo estaba formado por el baterista Nick Mason, el tecladista y vocalista Richard Wright, el bajista y vocalista Roger Waters y el guitarrista y vocalista principal Syd Barrett, quien se convirtió en el primer líder de la banda. Bob Klose fue guitarrista inicialmente por un corto tiempo, pero no llegó a aparecer en ningún disco.
       
        El extraño comportamiento de Barrett, causado por el excesivo consumo de drogas, especialmente LSD, hizo que su amigo David Gilmour se integrara al grupo en diciembre de 1967 y que quedase definida la formación clásica del grupo tras la marcha de Barrett en abril de 1968.
     </div>
     <div id="div2">
        <span class="overline">Van Halen</span> es una banda de <span class="overline">Hard Rock</span>, originaria de Estados Unidos. Inicialmente nombrada Mammoth por los fundadores de la banda (Eddie Van Halen, Alex Van Halen y Mark Stone) en el año 1972, en Pasadena, California; luego se unirían el cantante David Lee Roth y el bajista Michael Anthony.
       
        <span class="overline">Van Halen</span> alcanzó la fama rápidamente con su primer álbum debut homónimo en 1978, ampliamente considerado como un hit del rock, alcanzando ventas en Estados Unidos superiores a las <span class="overline">10 millones</span> de copias y siendo calificado en agosto de 1996 como disco de diamante. Mucha de la fama ganada en sus comienzos se debe a la habilidad de Eddie Van Halen, que es considerado uno de los más influyentes e innovadores guitarristas de todos los tiempos.
       
        La banda ha tenido 3 vocalistas: David Lee Roth, Sammy Hagar y Gary Cherone, y durante los años 80 tuvo más hits en la revista Billboard que ninguna otra banda de hard rock o heavy metal.
       
        En el año 2004 la banda decidió tomar un descanso de los escenarios al finalizar el tour reunión con Sammy Hagar, quien decide alejarse del grupo. Después de la posterior 'exclusión' de Anthony en 2006, cuando Eddie anunció que el nuevo bajista sería su hijo Wolfgang.
     </div>
     <div id="div3">
        AC/DC es un grupo de hard rock, formado en <span class="tachado">Sidney</span>, Australia, en 1973, por los hermanos de origen escocés, Malcolm y Angus Young.
           
        Sus álbumes se han vendido en numerosos               países, en un total estimado de <span class="tachado">200 millones de copias</span>, embarcándose en giras multitudinarias por todo el mundo, y sus éxitos han musicalizado varias producciones <spanclass="tachado">cinematográficas</span> sobresalientes. Son famosas sus actuaciones en vivo, resultando vibrantes y exultantes espectáculos de primer orden.
           
        Mucho de ello se debe al extravagante estilo de su guitarrista principal y símbolo visual, Angus Young, quien asume el rol de agitador musical
        durante los conciertos, gracias a sus dinámicos y adrenalínicos despliegues escénicos uniformado de colegial callejero. Al comienzo, los circuitos de pubs australianos fueron testigo de los primeros meses de vida del proyecto, tiempos por los cuales sufrieron diversos cambios en su alineación.
           
        En 1974, la llegada del cantante Bon Scott, se convertiría en pieza clave del éxito del grupo. Su presencia en escena, junto a los hermanos Young, lo convirtió en uno de los personajes más carismáticos de la historia del rock. La formación se estabilizaría con Mark Evans (bajo) y Phil Rudd (batería).</div>
     <div class="limpiador"></div>
  </body>
</html>

CU01040D.css
Código: [Seleccionar]
/* Hoja de estilos para el ejercicio CU01040D */

*{font-family: verdana, sans-serif;}

#div1,#div2,#div3{
  margin: 20px;
  padding: 10px;
  width: 200px;
  height: 400px;
  border: solid 4px black;
  float: left;
  font-size: 0.em;
  overflow: auto;
}

#div1{
  text-align: center;
  color: #FF6347;
  text-indent: 10%;
}

#div2{
  text-align: right;
  color: #008080;
  text-indent: 50px;
  white-space: pre-line;
}

#div3{
  text-align: justify;
  color: #8B4513;
  text-indent: :20%;
  white-space:pre-wrap;
}

.limpiador{
  border-style: none;
  clear: both;
  padding: 0;
  width: 0;
  height: 0;
}

.subrayado{text-decoration: underline;}
.overline{text-decoration: overline;}
.tachado{text-decoration: line-through;}
"Una persona inteligente es aquel que sabe ser tan inteligente como para contratar gente mas inteligente que el"

pedro,,

  • Moderador Global
  • Experto
  • *******
  • APR2.COM
  • Mensajes: 1292
    • Ver Perfil
Re:Text-Aling - Color - White-Space (CU01040D)
« Respuesta #3 en: 16 de Septiembre 2016, 13:40 »
Hola hymsoft.

Sobre el apartado c, la respuesta es no, lo que pasa es que al tener la propiedad "white-space: pre-line;", le estas diciendo que te mantenga los saltos de línea, y tu tienes la etiqueta de apertura del elemento "div", y en la siguiente línea comienza el texto, con lo cual el navegador lo que te muestra es ese primer salto de línea.

Sobre el apartado d, lo primero es es que en:
Código: [Seleccionar]
text-indent: :20%;tienes un error de sintaxis, si te fijas se te colaron ":" de más.

También tienes algún error más de sintaxis:
Código: [Seleccionar]
font-size: 0.em; 0. no es una medida válida.

Código: [Seleccionar]
<spanclass="tachado">cinematográficas</span>Aquí te comiste un espacio entre span y class.

Aun así, yo personalmente no he conseguido que si los 15 espacios coinciden después de una palabra al final de línea se muestren en la siguiente línea, pero si están en el interior de la línea si los muestra.


Saludos. ;D

hymsoft

  • Intermedio
  • ***
  • Mensajes: 103
  • hymsoft
    • Ver Perfil
Re:Text-Aling - Color - White-Space (CU01040D)
« Respuesta #4 en: 16 de Septiembre 2016, 13:48 »
Hola pedro!!!!! ahora si veo todo!!!! Gracias!!!!! Esto me hace acordar cuando tenia 20 y programaba con sueño a las 5am, pero con 25 años mas  :P :P :P

Saludos!!!!
"Una persona inteligente es aquel que sabe ser tan inteligente como para contratar gente mas inteligente que el"

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".