LMSGI02 - DAM - Lenguajes de marcas y sistemas de gestión de información - Utilización de lenguajes de marcas en entornos web. Contenidos.
3.5.3.- Propiedades de texto.
En el apartado anterior vimos los atributos relacionados con las fuentes y en este vamos a ver los relacionados con el texto en sí y son los siguientes:
Elemento | Descripción |
---|---|
text-decoration | Establece si el texto está subrayado, sobrerayado o tachado. los valores que puede tomar son: none, underline, overline, line-through o blink |
text-align | Indica la alineación del texto. Aunque las hojas de estilo permiten el justificado de texto no funciona en todos los sistemas. Los valores que puede tomar son: left, right, center o justify |
text-indent | Determina la tabulación del texto. Los valores que toma son una longitud, en unidades CSS, o un porcentaje de la establecida. |
text-transform | Nos permite transformar el texto, haciendo que tenga la primera letra en mayúsculas de todas las palabras, todo en mayúsculas o minúsculas. Los valores que puede tomar son: capitalize, uppercase, lowercase o none |
word-spacing | Determina el espaciado entre las palabras. Los valores que puede tomar es un tamaño. |
letter-spacing | Determina el espaciado entre letras. Los valores que puede tomar es un tamaño. |
vertical-align | Establece la alineación vertical del texto. Sus valores posibles son: baseline, sub, super, top, text-top, middle, bottom, text-bottom o un porcentaje. |
line-height | Altura de la línea. Puede establecerse mediante un tamaño o un porcentaje |
Un ejemplo de un documento XHTML en el que se utiliza este método para incluir formatos es:
<!DOCTYPE html>
<html>
<head>
<title>Ejemplo de atributos CSS de texto</title>
<style type="text/css">
h3 { text-decoration:underline; text-align: center; text-transform: capitalize }
p { text-indent: 50%; }
</style>
</head>
<body>
<h3>Ejemplo del uso de atributos de texto</h3>
<p>El texto de del encabezado de tercer nivel está subrayado, centrado y la primera letra de cada palabra es mayúcula.</p>
<p>El párrafo está tabulado</p>
</body>
</html>
Su aspecto en el navegador es el siguiente:
