Aplicar formato a un texto.

Resumen.

En este artículo veremos como aplicar formato a un texto dándole un aspecto tan elegante como nuestra imaginación permita. Con CSS esto es muy fácil, tenemos muchas propiedades que combinándolas adecuadamente, le darán a nuestros textos un aspecto muy distinguido.

Artículo.

Para darle formato a un texto en HTML no había muchas opciones, pero CSS nos brinda unas opciones que nos permiten configurar cualquier aspecto de nuestros textos. Las propiedades que vamos a presentar de manera destacada son las siguientes:
  • letter-spacing.- Nos permite determinar la separación entre cada una de las letras de nuestro texto.
  • word-spacing.- Si bien la propiedad anterior condiciona la separación entre palabras ya que los espacios en blanco los hace proporcionales a la separación de las letras, también podemos determinar el tamaño de los espacios en blanco, es decir, la separación entre las palabras.
  • line-height.- Dado que podemos separar las letras y las palabras, la separación entre las líneas de nuestro texto deben ir en consonancia con las anteriores, esto nos lo permite esta propiedad.
  • text-indent.- La sangría, o comienzo desplazado hacia la derecha de cada párrafo esto otro aspecto que nos permite configurar CSS para dar un formato elegante a nuestros textos.
También vamos a usar la propiedad font-family para aplicar un tipo de letra, la propiedad font-size para determinar el tamaño de la letra y color, para aplicar un color a nuestro texto.

También presentamos una nueva etiqueta, <span>palabra</span> que nos permite aplicar un formato concreto a una parte del texto, como por ejemplo, ponerlo en negrita. Para definir las propiedades de esta etiqueta la hacemos mediante el atributo class. La propiedad font-weight con valores comprendidos entre 100 y 900 nos permite graduar la intensidad de la negrita.

Así nuestro código quedaría de la siguiente manera:
<!DOCTYPE html>  <html lang="es">  <head>  <meta charset="UTF-8" />  <title>Formato para un texto. ArtesaniaWeb.ES</title> <script>     <!--   --> </script> <style>  <!--  .texto{     font-family: Tahoma;        /* para el tipo de letra */     font-size: 1.5rem;            /* para el tamano de las letras */     color: #312E2F;                /* para el color de las letras */     letter-spacing: 0.4rem;      /* para separacion entre letras */     word-spacing: 0.8rem;        /* para separacion entre palabras */       line-height: 3rem;             /* para la separacion entre lineas */      text-indent: 3rem;             /* para sangrias */  } .negrita{     font-weight: 900; }  -->  </style> </head>  <body>     <div class="texto">Para darle <span class="negrita">formato a un texto en HTML</span> no habia muchas opciones, pero      CSS nos brinda unas opciones que nos permiten configurar cualquier aspecto de nuestros      textos. Las propiedades que vamos a presentar son las siguientes:</div> </body>  </html>
Y esto es todo amigos, por supuesto que hay muchas más opciones para aplicar formato a un texto, pero aquí nos hemos limitado a las más elementales y así vamos mostrando las potencialidades de CSS.
Tags: Formato || sangrías || líneas || negrita

Comentarios.

Sin comentarios, publica el tuyo.