Búsqueda personalizada
 
 
 
 
Más propiedades relacionadas al texto
 

Vimos en el concepto anterior las propiedades:

color  
text-align  
text-decoration  

Ahora veremos el objetivo de las siguientes propiedades que nos faltan:

letter-spacing  
word-spacing  
text-indent  
text-transform
  

La propiedad letter-spacing y word-spacing permiten indicar el espacio que debe haber entre los caracteres y entre las palabras.
La propiedad text-indent, indenta la primera linea de un texto. A partir de la segunda línea, el texto aparece sin indentación. Podemos indicar un valor negativo con lo que la indentación es hacia la izquierda.
Por último, la propiedad text-transform puede inicializarse con alguno de los siguientes valores:

none - capitalize - lowercase - uppercase 

Cada uno de estos valores transforman el texto como sigue:
capitalize: Dispone en mayúsculas el primer caracter de cada palabra.
lowercase: Convierte a minúsculas todas las letras del texto.
uppercase: Convierte a mayúsculas todas las letras del texto.
none: No provoca cambios en el texto.

El siguiente ejemplo define reglas para las marcas h1 y p:

Es decir, podemos inicializar un conjunto de marcas HTML con una serie de propiedades de estilo comunes. Luego agregamos en forma individual las propiedades no comunes a dichas marcas:

h1,h2,h3,h4,h5,h6 {
  font-family:Verdana;
}
h1 {
  font-size:40px;
}

Es decir, a la marca h1 realmente le hemos definido 2 propiedades: font-family y font-size. Lo mismo para las otras marcas HTML.

<html>
<head>
<title>Problema</title>
<style type="text/css">
h1 {
letter-spacing:10px;
word-spacing:30px;
text-transform:capitalize;
}
p {
text-indent:20px;
}
</style>
</head>
<body>
<h1>Este es un ttulo de nivel 1</h1>
<p>Todo el texto siguiente se encuentra encerrada en la marca de prrafo
y con el objetivo de ver el efecto de la propiedad text-indent.
La propiedad text-indent podemos inicializarla con un valor positivo,
como es el caso actual o podemos inicializarla con un valor negativo lo que
provocar que el texto de la primera lnea del prrafo
comience en una columna inferior al de todo el bloque. </p>
</body>
</html>

La cabecera de nivel uno, tiene la siguiente regla:

h1 {
  letter-spacing:10px;
  word-spacing:30px;
  text-transform:capitalize;
}

Es decir que las letras deben tener una separación de 10 pixeles, las palabras deben estar separadas por 30 pixeles y por último deben disponerse en mayúsculas la primera letra de cada palabra.
Para la marca p tenemos la siguiente regla:

p {    
text-indent:20px;  
}  

Es decir, la primera línea del párrafo deberá imprimirse 20 píxeles a la derecha donde normalmente debería aparecer.

 
 
 
 
       

¿Quienes somos?

Condiciones de uso

Publicidad

Privacidad de la informacion