English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
@font-La regla face se utiliza para asociar el nombre de la fuente que se utilizará en la hoja de estilo con algunas fuentes descargables, @font-face regla-face CSS en
La regla se utiliza para especificar una fuente personalizada para la visualización del texto.font-familylos descriptores para nombrar la fuente y src para asociar con el nombre de la fuente externa.
La sintaxis de esta regla es:
@font-face: fuente-descripción
La @font-La regla face contiene una o más declaraciones de propiedades, como las que se utilizan en CSS convencional, lo que se conoce como descripción de fuentes. Puede especificar un máximo de24propiedades diferentes, pero todas sus explicaciones están fuera del alcance de este manual-Para obtener más información, visiteW3Módulo de fuentes CSSpágina.
@font-La forma general de la regla face es:
Más tarde, la fuente se puede usar como atributo (comofont-familyy) nombrefont，pero si no se admite la descarga de fuentes o por alguna razón no se puede cargar la fuente, debe especificar otro nombre de fuente como alternativa.
El siguiente ejemplo muestra cómo usar @font-atributo face.
@font-face {
font-family: "OpenSans";
src: url("../fonts/OpenSans-Regular.eot");
src: url("../fonts/OpenSans-Regular.ttf") format("truetype");
}
body {
font-family: "OpenSans", Arial, sans-serif;
font-tamaño: 1.2em;
}Ver el‹/›Nota:Al usar @ font-reglas face, no es necesario depender de la cantidad limitada de fuentes instaladas en el ordenador del usuario.
Al establecer las reglas correspondientes, cuando se establecen características específicas de fuentes como negrita o cursiva, también se puede establecer la selección de fuentes descargables específicas @font-face。
@font-face {
font-family: "OpenSans";
src: url("../fonts/OpenSans-Regular.eot");
src: url("../fonts/OpenSans-Regular.ttf") format("truetype");
}
@font-face {
font-family: "OpenSansBold";
src: url("../fonts/OpenSans-Bold.eot");
src: url("../fonts/OpenSans-Bold.ttf") format("truetype");
}
h1 {
font-family: "OpenSansBold", Arial, sans-serif; /* Especificar la fuente OpenSans bold */
}
p {
font-family: "OpenSans", Arial, sans-serif;
}Ver el‹/›El significado de los parámetros es el siguiente:
| Parámetro | Valor | Descripción |
|---|---|---|
| Obligatorio -Los siguientes parámetros son obligatorios. | ||
| font-family | font-family | Definirfont-familyNombre de la fuente del valor del atributo de la fuente. |
| src | src | Especificar la ubicación del archivo de fuente que se utilizará. |
| Opcional -Los siguientes parámetros son opcionales. | ||
| font-style | font-style | Valores válidosfont-styleValores válidos del atributo. |
| font-weight | font-weight | Valores válidosfont-weightValores de atributo (valores relativos bolder y lighter除外). |
@font-La compatibilidad del navegador del atributo face, los números en la tabla a continuación representan la versión mínima del navegador que admite la propiedad; todos los navegadores principales admiten esta regla.
|
Nota:En los navegadores, hay grandes diferencias en el soporte para tecnologías de fuentes específicas. Internet Explorer admite los tipos de fuentes .eot y .wof, mientras que Firefox, Chrome, Safari y Opera admiten los tipos de fuentes .woff, .ttf y .otf.
Consulte las siguientes instrucciones:Fuente CSS.