Compartir a través de


font-family

Establece el nombre de la fuente utilizada para el texto en el objeto.

Sintaxis

{ font-family: sFamily }

Valores posibles

sFamily

Cadena que especifica o recibe uno de los valores siguientes:

nombre de familia

Cualquiera de las familias de fuentes disponibles que admite el explorador (por ejemplo, Times, Helvetica, Zapf-Chancery, Western o Courier).

nombre genérico

Cualquiera de las siguientes familias de fuentes: serif, sans-serif, cursive, fantasy o monospace.

Esta propiedad no tiene un valor predeterminado. Se hereda.

Observaciones

El valor es una lista con orden de prioridad de nombres de familias de fuentes y nombres de familias genéricas. Los elementos de la lista están separados por comas para reducir al mínimo la confusión entre nombres de familias de fuentes formados por varias palabras. Si el nombre de la familia de fuentes incluye un espacio en blanco, el nombre debería aparecer encerrado entre comillas sencillas o dobles. Los nombres de familias de fuentes genéricas son valores y no pueden aparecer entre comillas.

Dado que no sabe qué fuentes instalaron los usuarios, debería ofrecer una lista de alternativas con una familia de fuentes genéricas al final de la lista. Esta lista puede incluir fuentes incrustadas. Para obtener más información sobre las fuentes incrustadas, vea la regla @font-face.

Ejemplos

En el siguiente ejemplo se muestra cómo usar una llamada a una hoja de estilo incrustada para establecer la propiedad font-family:

<html>
<head>
<style>
  p {font-family:"arial"}
  .other {font-family:"courier"}
</style>
</head>
<body>
  <p tabindex="1"
     onkeydown="this.className='other'"
onmousedown="this.className='other'"
onmouseup="this.className=''"
onkeyup="this.className=''">Tab to select this paragraph and press any key, or just click it, to change the font-family style property to COURIER.</p>
</body>
</html>

En el siguiente ejemplo se muestra cómo definir una jerarquía de fuentes (en este caso, una fuente incrustada y una fuente del sistema). El explorador busca en la lista hasta que encuentra una fuente que pueda aplicar. Esto resulta útil para las páginas con fuentes que podrían no estar accesibles o cargadas en el equipo de un usuario.

<style type="text/css">
   @font-face {
      font-family: "My_font";
      src: url(http://www.adatum.com/some_font_file.eot);
   }
   body {font-family: "My_font", Arial}
</style>

Información sobre estándares

Esta propiedad se define en la especificación Cascading Style Sheets (CSS), Level 1 (CSS1) (Hojas de estilos en cascada (CSS), nivel 1 (CSS1)).

Aplicable a

A, ADDRESS, B, BASEFONT, BIG, BLOCKQUOTE, BODY, BUTTON, CAPTION, CENTER, CITE, CODE, COL, COLGROUP, CUSTOM, DD, DEFAULTS, DFN, DIV, DL, DT, EM, FIELDSET, FORM, HN, HTML, I, IMG, INPUT TYPE=BUTTON, INPUT TYPE=CHECKBOX, INPUT TYPE=FILE, INPUT TYPE=IMAGE, INPUT TYPE=PASSWORD, INPUT TYPE=RADIO, INPUT TYPE=RESET, INPUT TYPE=SUBMIT, INPUT TYPE=TEXT, LI, OL, P, S, SELECT, SPAN, SUB, TABLE, TBODY, TD, TFOOT, TH, THEAD, TR, TT, U, UL, VAR, XMP

Vea también

Conceptos

font