Autor Tema: HTML y CSS white-space, text-indent y text-decoration Ejercicio CU01040D  (Leído 2089 veces)

Chompy129

  • Intermedio
  • ***
  • Mensajes: 130
  • Programar es divertido. :)
    • Ver Perfil
CSS text-align, color, text-decoration, text-indent, white-space nowrap, pre, pre-wrap, pre-line (CU01040D)

Aquí esta el ejercicio:

Código HTML
Código: [Seleccionar]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Atributos para los textos</title>
<link rel="stylesheet" type="text/css" href="textos.css">
</head>
<body>
<div id="div1">Sublime Text is a sophisticated text editor for code, markup and prose. <span class="sub">You'll love the slick user interface</span>, extraordinary features and <span class="sub">amazing performance.</span></div>

<div id="div2">Make ten changes at the same time, not one change ten times. <span class="sub-up">Multiple selections allow you to interactively</span> change many lines at once, rename variables with ease, and manipulate files faster than ever.

<span class="sub-up">Try pressing Ctrl+Shift+L to split the selection into lines and Ctrl+D to select the next occurrence of the selected word.</span>

  To make multiple selections with the mouse, take a look at the Column Selection documentation.</div>

<div id="div3">Key Bindings, Menus, Snippets, Macros, Completions and mo<span class="sub">               </span>and more - <span class="del">just about everything in</span> Sublime Text is customizable with <span class="del">simple</span> JSON files. This system gives you flexibility as settings can be specified on a <span class="del">per-file type and per-project basis.</span></div>
</body>
</html>

Código CSS
Código: [Seleccionar]
/*DATOS GENERALES*/
*{font-family: arial;}

/*Los div*/
div{margin: 20px; padding: 10px; width: 200px; height: 400px; border: 4px solid #000; float: left; background-color: #DDD;}
/*Clases para texto*/
.sub{text-decoration: underline;} /*Subrayado*/
.sub-up{text-decoration: overline;} /*Subrayado-arriba*/
.del{text-decoration: line-through;} /*Tachado*/

/*Div por id*/
#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;}

Siendo sincero las especificaciones sobre el white-space me confundieron un poco, pero espero que sean correctas.

pedro,,

  • Moderador Global
  • Experto
  • *******
  • APR2.COM
  • Mensajes: 1292
    • Ver Perfil
Re:HTML y CSS white-space, text-indent y text-decoration Ejercicio CU01040D
« Respuesta #1 en: 18 de Septiembre 2016, 23:30 »
Hola Chompy129.

Todo bien.

Saludos. ;D

 

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".