Volver atrás

Otras propiedades para fuentes en CSS

Info extraída de W3Schools, donde se pueden consultar la detalle todas las propiedades de CSS existentes.


font-variant

En una fuente de versalitas, todas las letras minúsculas se convierten en letras mayúsculas. Sin embargo, las letras mayúsculas convertidas aparecen en un tamaño de fuente más pequeño que las letras mayúsculas originales en el texto.

Un párrafo con font-variant valor normal (por defecto).

Un párrafo con font-variant valor small-caps (versalitas).

Ver más sobre font-variant en W3Schools

letter-spacing

Aumenta o disminuye el espacio entre caracteres en un texto.

Un párrafo con letter-spacing en valor normal (por defecto).

Un párrafo con letter-spacing en valor 0.2em

Un párrafo con letter-spacing en valor 0.5em

Un párrafo con letter-spacing en valor -0.05em

Un párrafo con letter-spacing en valor -0.2em

Ver más sobre letter-spacing en W3Schools

word-spacing

Aumenta o disminuye el espacio en blanco entre las palabras.

Un párrafo con word-spacing de valor normal (por defecto).

Un párrafo con word-spacing de valor 0.3em

Un párrafo con word-spacing de valor 0.6em

Un párrafo con word-spacing de valor -0.05em

Un párrafo con word-spacing de valor -0.2em

Ver más sobre word-spacing en W3Schools

white-space

Aumenta o disminuye el espacio entre caracteres en un texto.

Un párrafo con white-space en valor normal (por defecto). Las secuencias de espacios en blanco colapsarán en un solo espacio en blanco. El texto se ajustará cuando sea necesario.

Un párrafo con white-space en valor nowrap. Las secuencias de espacios en blanco colapsarán en un solo espacio en blanco. El texto nunca pasará a la siguiente línea. El texto continúa en la misma línea hasta que se encuentra una etiqueta <br>

Un párrafo con white-space en valor pre. El navegador conserva los espacios en blanco. El texto solo se ajustará en los saltos de línea. Actúa como la etiqueta <pre> en HTML.

Un párrafo con white-space en valor pre-line. Las secuencias de espacios en blanco colapsarán en un solo espacio en blanco. El texto se ajustará cuando sea necesario y en los saltos de línea.

Un párrafo con white-space en valor pre-wrap. El navegador conserva los espacios en blanco. El texto se ajustará cuando sea necesario y en los saltos de línea.

Ver más sobre white-space en W3Schools

word-break

Especifica cómo deben dividirse las palabras al llegar al final de una línea.

Un párrafo con word-break en valor normal (por defecto). Utiliza reglas de salto de línea predeterminadas.

Un párrafo con word-break en valor break-all. Para evitar el desbordamiento, la palabra puede dividirse en cualquier carácter.

Los saltos de palabra no deben usarse para texto en chino/japonés/coreano (CJK). El comportamiento del texto que no es CJK es el mismo que el valor "normal".

Un párrafo con word-break en valor break-word. Para evitar el desbordamiento, la palabra puede dividirse en puntos arbitrarios.

Ver más sobre word-break en W3Schools

word-wrap

Permite que las palabras largas se puedan dividir y pasar a la siguiente línea.

Un párrafo con word-wrap en valor normal (por defecto). Rompe las palabras solo en los puntos de ruptura permitidos.

Un párrafo con word-wrap en valor break-word. Permite romper palabras irrompibles.

Ver más sobre word-wrap en W3Schools

text-overflow

Especifica cómo se debe señalar al usuario el contenido desbordado que no se muestra. Se puede recortar, mostrar puntos suspensivos (...) o mostrar una cadena personalizada.

Las dos propiedades siguientes son necesarias para el desbordamiento de texto:

white-space: nowrap;

overflow: hidden;

Un párrafo con text-overflow en valor clip (por defecto). El texto está recortado y no es accesible.

Un párrafo con text-overflow en valor ellipsis. Muestra puntos suspensivos ("...") para representar el texto recortado

Un párrafo con text-overflow en valor "**". Muestra la cadena dada para representar el texto recortado. (Solo funciona en Firefox)

Ver más sobre text-overflow en W3Schools

direction

Especifica la dirección del texto/dirección de escritura dentro de un elemento a nivel de bloque.

Un párrafo con direction en valor ltr (por defecto).

Un párrafo con direction en valor rtl.

Ver más sobre direction en W3Schools

writing-mode

Especifica si las líneas de texto se disponen horizontal o verticalmente.

Un párrafo con writing-mode en valor horizontal-tb (por defecto). Deja que el contenido fluya horizontalmente de izquierda a derecha, verticalmente de arriba a abajo.

Un párrafo con writing-mode en valor vertical-rl
Deja que el contenido fluya verticalmente
de arriba a abajo, horizontalmente de derecha
a izquierda.


Un párrafo con writing-mode en valor vertical-lr.
Deja que el contenido fluya verticalmente
de arriba a abajo, horizontalmente de izquierda
a derecha.

Ver más sobre writing-mode en W3Schools

line-height

Especifica la altura de una línea.

Un párrafo con line-height en valor -0.5em

Un párrafo con line-height en valor 1em

Un párrafo con line-height en valor 3em

Ver más sobre line-height en W3Schools