La font-familypropiedad define la fuente que se aplica al elemento seleccionado. La fuente que se selecciona no es una única fuente, sino una "familia" y, por lo tanto, puede depender de otros valores de propiedad tipográfica para seleccionar la fuente correcta dentro de la familia.
body ( font-family: Arial, Helvetica, sans-serif; )Un valor puede ser uno de los siguientes:
- Un nombre de familia de fuentes que coincide con una fuente incrustada en la página o disponible en el sistema del usuario.
- Una serie de apellidos, separados por comas, que pueden incluir un apellido genérico
Si se utilizan varios apellidos, el navegador seleccionará el primero que encuentre incrustado en la página utilizando @font-faceo instalado en el sistema operativo del usuario.
Porque font-familyno hay un valor inicial o predeterminado específico; el valor inicial siempre depende del navegador y / o sistema operativo.
Nombres de familia genéricos
Si se utilizan varios valores para una sola declaración, se recomienda tener una familia genérica en la última lista como alternativa para garantizar la mejor experiencia tipográfica:
code ( font-family: Courier, Monaco, monospace; )En el ejemplo anterior, "Courier" y "Monaco" son apellidos reales de fuentes reales, mientras que "monoespacio" es solo una referencia genérica a cualquier fuente instalada en el sistema del usuario que sea monoespaciada.
Si los dos primeros no se encuentran instalados, el navegador seleccionará la mejor opción, pero solo de fuentes monoespaciadas. Sin la familia genérica, la fuente sería la fuente predeterminada en el sistema del usuario (probablemente una serif o sans-serif), lo que sería indeseable.
Nombres de familias genéricas incluyen serif, sans-serif, cursive, fantasy, y monospace.
Si un apellido coincide con un apellido genérico, se debe citar el apellido para indicar que no es genérico.
Nombres familiares de varias palabras
Si un apellido contiene varias palabras, separadas por espacios, se recomienda incluir el apellido entre comillas (simples o dobles):
code ( font-family: "Times New Roman", Georgia, serif; )Esto no siempre es necesario, pero generalmente es más seguro incluir las comillas de cualquier apellido que tenga espacios o caracteres especiales.
Soporte del navegador
| Cromo | Safari | Firefox | Ópera | ES DECIR | Androide | iOS |
|---|---|---|---|---|---|---|
| Trabajos | Trabajos | Trabajos | Trabajos | Trabajos | Trabajos | Trabajos |