CSS define numerosas propiedades para modificar a aparencia do texto. A pesar de que non dispón de tantas posibilidades como as linguaxes e programas específicos para crear documentos imprimidos, CSS permite aplicar estilos complexos e moi variados ao texto das páxinas web.
| Propiedade | Valores que acepta | Descrición | Exemplos |
|---|---|---|---|
color |
Calquera cor | Establece a cor de letra utilizada para o texto |
p { color: black; }
h1 { color: #fb3; }
h2 { color: #34a58f; }
h3 { color: rgb (71, 98, 241); }
|
font-family |
Tipo de letra |
Establece o tipo de letra utilizada para o texto |
body { font-family: Arial, Helvetica, sans-serif; }
|
font-size |
Unidade de medida | Establece o tamaño de letra utilizado para o texto |
p { font-size: 10pt; }
h1 { font-size: 32px; }
h2 { font-size: 2.5em; }
|
font-weight |
|
Establece a anchura de letra utilizado para o texto (normal, negriña, fina, ou especificamos un ancho de 100 a 900) |
p { font-weight: bold; }
h1 { font-weight: 100; }
h2 { font-weight: lighter; }
|
font-style |
|
Establece o estilo de letra utilizado para o texto (normal ou cursiva) |
p { font-style: italic; }
h1 { font-style: normal; }
h2 { font-weight: italic; }
|
font-variant |
|
Establece o estilo alternativo de letra utilizado para o texto (normal ou versal) |
p { font-variant: small-cap; }
h1 { font-variant: normal; }
h2 { font-variant: small-cap; }
|
text-transform |
|
Transforma o texto a maiúsculas, minúsculas ou capitaliza a primeira letra de cada palabra. |
p { text-transform: none; }
h1 { text-transform: capitalize; }
|
text-decoration |
|
Establece a decoración que se engade ao texto |
a { text-decoration: none; }
h1 { text-decoration: underline; }
|
text-align |
|
Establece a alineación do texto |
p { text-align: justify; }
h1 { text-align: center; }
h2 { text-align: right; }
|
vertical-align |
|
Establece a alineación vertical do texto |
td { vertical-align: middle; }
td.clase { vertical-align: 10px; }
td#identi { vertical-align: top; }
|
text-indent |
Unidade de medida | Establece a sangría da primeira liña do texto |
p { text-indent: 32px; }
|
line-height |
Unidade de medida | Establece o interliñado do texto |
p { line-height: 16pt; }
h1 { line-height: 24px; }
h2 { line-height: 130%; }
|
letter-spacing |
Unidade de medida | Establece a separación entre as letras do texto |
p { letter-spacing: 2px; }
|
word-spacing |
Unidade de medida | Establece a separación entre as palabras do texto |
p { word-spacing: 10px; }
|
white-space |
Espazos en branco | Establece o tratamento dos espacios en branco |
p { white-space: normal; }
|
text-shadow |
Sombra | Establece a sombra para o texto. Funciona a partir do estándar CSS3. |
h1 { text-shadow:
5px 10px 7px rgb(10, 230, 89); }
h2 { text-shadow:
5px 10px 7px rgb(10, 230, 89), -5px -10px 7px rgb(10, 230, 89); }
|
