hogar › Internet › Descargue fuentes estándar dat. Fuentes comunes a todas las versiones (actuales) de Windows y sus equivalentes de Mac

Descargue fuentes estándar dat. Fuentes comunes a todas las versiones (actuales) de Windows y sus equivalentes de Mac

Esta lista contiene fuentes comunes a todos los sistemas operativos Windows actuales (de hecho, desde Windows 98) y sus equivalentes en Mac OS. Estas fuentes a veces se denominan "fuentes seguras para el navegador" ( fuentes seguras para el navegador). Este es un pequeño libro de referencia que utilizo cuando hago páginas web y creo que también te será útil.

Si eres nuevo en el diseño web, es posible que estés pensando algo como: “¿Por qué debería limitarme a un conjunto tan pequeño de fuentes? ¡Tengo una colección enorme de fuentes hermosas! El hecho es que el navegador del visitante solo puede mostrar aquellas fuentes que están instaladas en su Sistema operativo ( aprox. traductor: Actualmente, ya es posible utilizar prácticamente cualquier fuente al diseñar páginas utilizando CSS 3 y su nueva propiedad. @Perfil delantero; sin embargo, no todos los navegadores todavía soportan esta función), lo que significa que cada el visitante de su página debe ser el propietario de las fuentes que ha elegido. Por lo tanto, sólo debes utilizar fuentes que estén disponibles en cada sistema operativo. Por suerte, CSS tiene una propiedad @Familia tipográfica, lo que facilita esta tarea.

Lista

@font-familia significado	ventanas	Mac	Familia
Arial, helvética, sans-serif	arial	Arial, Helvética	sans-serif
"Arial Black", Gadget, sans-serif	Arial Negro	Arial Negro, Gadget	sans-serif
"Comic Sans MS", cursiva	Cómic Sans MS	Cómic Sans MS 5	cursivo
"Courier New", Courier, monoespacio	Mensajero nuevo	Mensajero Nuevo, Mensajero 6	monoespacio
Georgia, serifa	georgia 1	Georgia	serifa
Impacto, Carbón, sans-serif	Impacto	Impacto 5, Carbón 6	sans-serif
"Lucida Console", Mónaco, monoespacio	Consola Lúcida	Mónaco 5	monoespacio
"Lucida Sans Unicode", "Lucida Grande", sans-serif	Lúcida sin Unicode	lucida grande	sans-serif
"Palatino Linotipo", "Libro Antiqua", Palatino, serif	Linotipo Palatino, Libro Antiqua 3	palatina 6	serifa
Tahoma, Ginebra, sans-serif	tahoma	Ginebra	sans-serif
"Times New Roman", Times, serifa	Times New Roman	Veces	serifa
"Trebuchet MS", helvética, sans-serif	Trabuquete MS 1	helvética	sans-serif
Verdana, Ginebra, sans-serif	Verdana	Verdana, Ginebra	sans-serif
Símbolo	Símbolo 2	Símbolo 2	-
Cintas	Cintas 2	Cintas 2	-
Wingdings, "Zapf Dingbats"	Alas 2	Zapf Dingbats 2	-
"MS Sans Serif", Ginebra, sans-serif	MS Sans Serif 4	Ginebra	sans-serif
"MS Serif", "Nueva York", serif	MS Serif 4	Nueva York 6	serifa

1 Las fuentes Georgia y Trebuchet MS se envían con Windows 2000/XP y están incluidas en el paquete de fuentes de IE (y de hecho vienen con muchas aplicaciones de Microsoft), por lo que se instalan en muchas computadoras con Windows 98.

2 Las fuentes de símbolos se muestran solo en Internet Explorer; en otros navegadores generalmente se reemplazan por una fuente estándar (aunque, por ejemplo, la fuente Symbol se muestra en Opera y Webdings en Safari).

3 La fuente Book Antiqua es casi idéntica a Palatino Linotype; Palatino Linotype viene con Windows 2000/XP y Book Antiqua viene con Windows 98.

4 Tenga en cuenta que estas fuentes no son TrueType, sino mapas de bits, por lo que pueden verse mal en algunos tamaños (están diseñadas para mostrarse a 8, 10, 12, 14, 18 y 24 pt a 96 DPI).

5 Estas fuentes solo funcionan en Safari en estilo estándar, pero no funcionan en negrita ni cursiva. Comic Sans MS también funciona en negrita, pero no en cursiva. Otros navegadores de Mac parecen poder emular por sí solos las propiedades de fuente que faltan (gracias a Christian Fecteau por el consejo).

6 Estas fuentes se instalan en Mac solo con instalación clásica

Capturas de pantalla

Mac OS X 10.4.8, Firefox 2.0, ClearType habilitado (gracias a Juris Vecvanags por la captura de pantalla)
Mac OS X 10.4.4, Firefox 1.5, ClearType habilitado
Mac OS X 10.4.11, Safari 3.0.4, ClearType habilitado (gracias a Nolan Gladius por la captura de pantalla)
Mac OS X 10.4.4, Safari 2.0.3, ClearType habilitado (gracias a Eric Zavesky por la captura de pantalla)
Windows Vista, Internet Explorer 7, ClearType habilitado
Windows Vista, Firefox 2.0, ClearType habilitado (gracias a Michiel Bijl por la captura de pantalla)

Al comenzar a crear un diseño, debe especificar específicamente en el CSS las fuentes utilizadas en la página. A menudo, en diferentes fuentes, el diseñador escribe no solo el texto principal de la página, sino también varios títulos, logotipos y monogramas.

Un buen diseñador, al igual que un buen maquetador, sabe que el navegador sólo puede utilizar aquellas fuentes que están instaladas en la computadora del usuario para mostrar una página. Es decir, las fuentes se pueden dividir en dos categorías:

Fuentes que serán mostradas sin problemas por la gran mayoría de usuarios.
Fuentes que un grupo bastante numeroso de usuarios no tiene.

Si el diseñador utilizó fuentes de la segunda categoría para crear, por ejemplo, un logotipo o títulos estáticos grandes, no puede dudar en utilizar la técnica de reemplazar el texto con una imagen. La desventaja de utilizar esta técnica es la inflexibilidad. Si hay cambios en el texto, tendrás que rehacer la imagen y cambiar el CSS (por ejemplo, si las dimensiones de la nueva imagen no coinciden con las antiguas).

Podemos decir que el peligro de utilizar una técnica depende directamente de la probabilidad de cambiar el texto. Por lo tanto, por ejemplo, el texto general de una página no se puede escribir con fuentes no estándar. Un diseñador competente nunca haría esto. Y si el diseñador se encuentra con una fuente verde, un buen maquetador simplemente está obligado a corregir su error: en el diseño, reemplace esta fuente por la estándar más similar.

Pero, ¿cómo se pueden distinguir las fuentes del primer grupo del segundo? ¡Está claro que no puedes confiar en un conjunto de fuentes instaladas directamente en tu computadora! Vamos a resolverlo.

Fuentes estándar

Las fuentes estándar son un conjunto de fuentes que se instalan con el sistema operativo. Dado que los sistemas operativos son diferentes, su conjunto de fuentes es diferente. Puede encontrar una lista de fuentes estándar para diferentes versiones de Windows, por ejemplo, en el artículo Fuentes estándar de Windows y una lista de fuentes estándar de Mac OS en la página Fuentes incluidas con Mac OS. En cuanto a los sistemas operativos Unix/Linux, no tienen un único conjunto de fuentes. Muchos usuarios de Linux utilizan el conjunto de fuentes DejaVu, especialmente en Ubuntu, están instalados de forma predeterminada. Según las estadísticas de http://www.codestyle.org, muchos usuarios de Unix/Linux también tienen instalados conjuntos de fuentes URW, Free y otros. Según las mismas estadísticas, más del 60% de los usuarios de Unix/Linux tienen en sus ordenadores fuentes del Core Fonts for Web, que hasta 2002 estaban oficialmente disponibles para su descarga gratuita en el sitio web de Microsoft.

Para que la página se muestre como la concibió el diseñador en cualquier sistema operativo, es posible especificar varias fuentes en la propiedad CSS font-family, enumeradas separadas por comas.

Esta propiedad especifica una lista priorizada de nombres de familias de fuentes y/o nombres de familias genéricos. Según la especificación CSS2, existen dos tipos de nombres de familias de fuentes:

El nombre de la familia de fuentes de su elección. Por ejemplo, "Times New Roman", "Arial" y otros. Los nombres de familias de fuentes que contienen espacios deben ir entre comillas. Si faltan comillas, se ignoran los caracteres de espacio antes y después del nombre de la fuente y cualquier secuencia de espacios dentro del nombre de la fuente se convierte en un solo espacio.
Familia genérica (común). La especificación define las siguientes familias genéricas:
- serif: fuentes con serifas en los extremos;
- sans-serif - fuentes sans-serif;
- cursiva - fuentes en cursiva;
- fantasía - fuentes decorativas;
- monospace - fuente monospace (con letras del mismo ancho).

Los apellidos de los clanes son palabras clave y no es necesario escribirlos entre comillas.

Así, para el diseño se toma una fuente estándar del sistema operativo Windows, se selecciona una similar para Mac OS y Unix/Linux, se especifica una familia de fuentes común y listo.

Pero no es tan simple. Profundicemos con más detalle.

Encontrar fuentes seguras para la web

En Internet, el concepto de fuentes web "seguras" se ha desarrollado históricamente. Una fuente segura es una fuente estándar para todos los sistemas operativos. Como sólo podemos soñar con tal situación, ¡no existen fuentes absolutamente seguras!

Algunas fuentes pueden considerarse seguras con algunas reservas.

La base para definir las fuentes "seguras" fueron las fuentes del sistema operativo Windows más común, que también se utilizan en otros sistemas operativos. Un ejemplo de este uso son las fuentes Core ya mencionadas para el paquete de fuentes web, que, según las estadísticas, han sido descargadas por muchos usuarios de Unix/Linux.

Este paquete incluye las siguientes fuentes: Andale Mono, Arial Black, Arial, Comic Sans MS, Courier New, Georgia, Impact, Times New Roman, Trebuchet MS, Verdana, Webdings. Todos ellos admiten el alfabeto cirílico, que es importante para Runet.

El conjunto de fuentes que viene de serie con Mac OS X (este sistema operativo es el más utilizado entre los usuarios de Mac OS) incluye todas las fuentes del conjunto de fuentes principales para la Web.

Así, basándose en las fuentes de Windows utilizadas en otros sistemas operativos, se formó la siguiente lista de las llamadas fuentes web "seguras":

arial
Arial Negro
Cómic Sans MS
Mensajero nuevo
Georgia
Impacto
Times New Roman
Trabuquete MS
Verdana

La fuente Webdings contiene iconos y no se puede utilizar para contenido. Andale Mono no se usa mucho porque no es adecuado para la lectura de pantalla diaria y no todos los usuarios de Windows lo tienen.

Todos los usuarios de Windows, Mac OS X y la gran mayoría de los usuarios de Unix/Linux (es decir, aquellos que han instalado las fuentes Core para el paquete Web) tienen todas estas fuentes.

¿Pero qué pasa con el resto? Después de todo, ¡lo que quieres es que el mayor número posible de usuarios vean el plan del diseñador!

Fuentes compatibles con cirílico

Una característica específica de RuNet es el problema con las codificaciones de páginas y la compatibilidad con el cirílico en las fuentes. Para evitar problemas con varias codificaciones de caracteres, a personas inteligentes se les ocurrió Unicode, que le permite combinar caracteres de varios idiomas en una sola fuente. Por lo tanto, para las páginas en ruso es necesario utilizar únicamente fuentes Unicode que admitan cirílico.

A continuación se muestra una tabla de correspondencias de fuentes.

ventanas	Mac OS	Unix/Linux	familia ancestral
Arial Negro	Helvética C.Y.	Nimbus Sans L	Sans-serif
arial	Helvética C.Y.	Nimbus Sans L	Sans-serif
Cómic Sans MS	Mónaco CY	* (vea abajo)	cursivo
Mensajero nuevo	* (vea abajo)	Nimbus Mono L	monoespacio
Georgia	* (vea abajo)	Libro escolar del siglo L	Serifa
Impacto	Carbón C.Y.	* (vea abajo)	Sans-serif
Times New Roman	Times CY	Nimbus Romano No9 L	Serifa
Trabuquete MS	Helvética C.Y.	* (vea abajo)	Sans-serif
Verdana	Ginebra C.Y.	DejaVu Sans	Sans-serif

* en la columna opuesta a la fuente significa que el sistema operativo no tiene equivalentes cirílicos nativos de la fuente de Windows. Pero al mismo tiempo, existe una alta probabilidad de que esta fuente esté instalada directamente en el sistema operativo.

Por ejemplo, si el texto principal del diseño es Arial, buscamos esta fuente en la tabla y escribimos la línea correspondiente en CSS:

cuerpo (familia de fuentes: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif;)

cuerpo(

fuente - familia: Arial, "Helvetica CY", "Nimbus Sans L", sans - serif;

Esta entrada significa que si el usuario tiene la fuente Arial (y todos los usuarios de Windows y todos los usuarios de Mac OS X la tienen), la página se mostrará con esta fuente. Si el usuario no tiene esta fuente, entonces la página de un usuario de Mac OS 9 de habla rusa se mostrará exactamente en la fuente estándar del sistema Helvetica CY, y para un usuario de Unix/Linux se mostrará en la fuente Nimbus Sans L. , que está instalado en el 90% de los usuarios de Unix/Linux. Si el usuario de Unix/Linux se encuentra en el 10% que no tiene esta fuente, entonces la página se mostrará en la fuente serif configurada de forma predeterminada para ver páginas web.

Además del hecho de que la tabla tiene en cuenta las fuentes Unix/Linux, también hay un extraño icono CY después del habitual Helvetica. ¡Averigüemos qué es!

Antes del lanzamiento de Mac OS X, esta línea tenía el siguiente significado: para los usuarios de Windows, mostramos la página en Arial, para los usuarios de Mac OS 9, en la fuente Helvetica estándar, y para el resto, vemos la página en el sistema. fuente sans-serif, que está configurada por defecto en el navegador. Pero, de nuevo, ¡un matiz importante! ¡La fuente Helvetica estándar de Mac OS 9 no tiene cirílico! Para la página en ruso, esto significó lo siguiente: para los usuarios de Windows mostramos la página Arial, para los usuarios de Mac OS 9, en la fuente estándar Helvetica, que muestra información ilegible, y el resto ve la página con el sistema sans-serif. fuente configurada por defecto en el navegador.

Para mostrar correctamente este conjunto a los usuarios de Mac OS 9, en lugar de Helvetica no cirílico, tiene sentido especificar la misma fuente estándar de Mac OS 9, Helvetica CY, que contiene cirílico.

La lectura de las reglas ha cambiado desde el lanzamiento de Mac OS X. Ahora hay una fuente estándar común especificada para Windows/Mac OS X. Y si queremos que los usuarios de Mac OS 9 puedan ver la intención del diseñador, debemos incluir una fuente que contenga cirílico en la línea de fuente.

Entonces, si bien no existen fuentes seguras, existen familias de fuentes seguras. También se les llama pilas de fuentes CSS. Además de las fuentes estándar de Windows/Mac OS X, estas líneas también pueden incluir fuentes equivalentes del conjunto estándar de Mac OS 9 (que no contiene fuentes "seguras" de forma predeterminada) y fuentes comunes de Unix/Linux.

Cualquier diseñador de diseño, tarde o temprano, se encuentra con un momento en el que un diseñador utiliza una fuente en un diseño que no está incluida en la lista de fuentes "seguras"; ¡Pero esto todavía no es motivo para hacer sonar la alarma! Por ejemplo, los diseñadores suelen utilizar en sus diseños la fuente Tahoma, que no está incluida en esta lista. Una línea de fuentes correctamente construida abre la posibilidad de utilizar no sólo Tahoma, sino también otras fuentes. Cada vez más diseñadores aprovechan esta oportunidad y un maquetador competente debería saberlo.

A continuación se muestra una tabla adicional de fuentes que no están incluidas en la lista de fuentes "seguras", pero que se pueden utilizar en diseños.

ventanas	Mac OS	familia ancestral
Consola Lúcida	Mónaco	monoespacio
Lúcida sin Unicode	lucida grande	Sans-serif
tahoma	Ginebra C.Y.	Sans-serif

¿Qué pasa si no existe el alfabeto cirílico?

Para los textos en inglés, las tablas anteriores tienen una apariencia ligeramente diferente.

ventanas	Mac OS	Unix/Linux	familia ancestral
Arial Negro	Artilugio	Nimbus Sans L	Sans-serif
arial	helvética	Nimbus Sans L	Sans-serif
Cómic Sans MS	Mónaco	TSCu_Comic	cursivo
Mensajero nuevo	mensajero	Nimbus Mono L	monoespacio
Georgia	* (vea abajo)	Libro escolar del siglo L	Serifa
Impacto	Carbón	Rekha	Sans-serif
Times New Roman	Veces	Nimbus Romano No9 L	Serifa
Trabuquete MS	helvética	Garuda	Sans-serif
Verdana	Ginebra	DejaVu Sans	Sans-serif

Para las fuentes Arial, Courier New y Times New Roman, al crear reglas, es mejor especificar primero la fuente Unix/Linux y luego la fuente Mac OS. Esto se debe a cierta corrupción del conjunto de fuentes principales de Linux X11.

Las fuentes que no están incluidas en la lista "seguras", pero que se pueden usar en diseños, se definen mejor mediante pilas de fuentes CSS basadas en esta tabla.

ventanas	Mac OS	Unix/Linux	familia ancestral
Consola Lúcida	Mónaco	-	monoespacio
Lúcida sin Unicode	lucida grande	Garuda	Sans-serif
Linotipo palatino	Palatino	Garuda**	Sans-serif
tahoma	Ginebra	kalimati	Sans-serif

Un guión en la columna Unix/Linux indica que los usuarios de estos sistemas operativos probablemente verán la fuente predeterminada en la página.

** En esta línea, tiene sentido colocar la fuente Garuda antes que Palatino (ver explicación arriba).

Conclusiones:

No existen fuentes absolutamente seguras. Las siguientes fuentes pueden considerarse condicionalmente seguras:
- arial
- Arial Negro
- Cómic Sans MS
- Mensajero nuevo
- Georgia
- Impacto
- Times New Roman
- Trabuquete MS
- Verdana
En el artículo se pueden encontrar pilas de CSS seguras que tienen en cuenta la compatibilidad con el alfabeto cirílico en las fuentes.
Si la compatibilidad con el alfabeto cirílico no es importante en la página, utilizamos las pilas de CSS del artículo.

Fuentes que serán mostradas sin problemas por la gran mayoría de usuarios.
Fuentes que un grupo bastante numeroso de usuarios no tiene.

Si el diseñador utilizó fuentes de la segunda categoría para crear, por ejemplo, un logotipo o títulos estáticos grandes, no puede dudar en utilizar la técnica. La desventaja de utilizar esta técnica es la inflexibilidad. Si hay cambios en el texto, tendrás que rehacer la imagen y cambiar el CSS (por ejemplo, si las dimensiones de la nueva imagen no coinciden con las antiguas).

Fuentes estándar

Para que la página se muestre como la concibió el diseñador, en cualquier sistema operativo, es posible especificar varias fuentes en la propiedad CSS, separadas por comas.

El nombre de la familia de fuentes de su elección. Por ejemplo, "Times New Roman", "Arial" y otros. Los nombres de familias de fuentes que contienen espacios deben ir entre comillas. Si faltan comillas, se ignoran los caracteres de espacio antes y después del nombre de la fuente y cualquier secuencia de espacios dentro del nombre de la fuente se convierte en un solo espacio.
Familia genérica (común). La especificación define las siguientes familias genéricas:
- serif: fuentes con serifas en los extremos;
- sans-serif - fuentes sans-serif;
- cursiva: fuentes en cursiva;
- fantasía - fuentes decorativas;
- monospace - fuente monospace (con letras del mismo ancho).
Los apellidos de los clanes son palabras clave y no es necesario escribirlos entre comillas.

Así, para el diseño se toma una fuente estándar del sistema operativo Windows, se selecciona una similar para Mac OS y Unix/Linux, se especifica una familia de fuentes común y listo.

Pero no es tan simple. Profundicemos con más detalle.

Encontrar fuentes seguras para la web

En Internet, el concepto de fuentes web "seguras" se ha desarrollado históricamente. Una fuente segura es una fuente estándar para todos los sistemas operativos. Puesto que sólo se puede soñar con tal estado de cosas, entonces ¡No existen fuentes absolutamente seguras!

Algunas fuentes pueden considerarse seguras con algunas reservas.

Así, basándose en las fuentes de Windows utilizadas en otros sistemas operativos, se formó la siguiente lista de las llamadas fuentes web "seguras":

arial
Arial Negro
Cómic Sans MS
Mensajero nuevo
Georgia
Impacto
Times New Roman
Trabuquete MS
Verdana

Todos los usuarios de Windows, Mac OS X y la gran mayoría de los usuarios de Unix/Linux (es decir, aquellos que han instalado las fuentes Core para el paquete Web) tienen todas estas fuentes.

¿Pero qué pasa con el resto? Después de todo, ¡lo que quieres es que el mayor número posible de usuarios vean el plan del diseñador!

Lea sobre esto en la segunda parte de la publicación.

Las fuentes son una parte integral y muy importante del diseño de un sitio web, enfatizando su individualidad. El artículo hablará sobre cómo conectar fuentes estándar a una página web, también se les llama fuentes del sistema, y en el siguiente artículo veremos en detalle cómo elegir y conectar fuentes de Google Fonts a un sitio de WordPress.

Fuentes de sistema, estándar y seguras

Cualquier navegador muestra solo aquellas fuentes que están presentes en el sistema operativo de la computadora. Por eso se llaman de sistema y se instalan por defecto junto con el sistema operativo.

Y se denominan fuentes seguras porque es probable que se muestren en el navegador de la mayoría de los visitantes del sitio.

Pero el problema es que los diferentes sistemas operativos tienen instalados diferentes conjuntos de fuentes. Puede ver los conjuntos de fuentes suministrados junto con el sistema operativo en las páginas oficiales de Windows y Mac OS. Y en Unix/Linux no existe ningún estándar.

Para que la página de Internet se muestre de acuerdo con la idea del diseñador, se instaló en CSS una propiedad de fuente llamada font-family

propiedad de familia de fuentes

La propiedad font-family son familias de fuentes agrupadas por ciertas características.

Familias genéricas:

serif: fuentes con serifas en los extremos;
sans-serif - fuentes sans-serif;
cursiva - fuentes en cursiva;
fantasía - fuentes decorativas;
monospace - fuente monospace (con letras del mismo ancho).

De este modo, simplemente se seleccionan fuentes similares de diferentes sistemas operativos y se conectan a la página de Internet separadas por comas.

Aquí hay un ejemplo, solo para la percepción visual. Volveremos a este ejemplo más adelante cuando consideremos la conexión directa de fuentes.

Simplemente sigue la lógica y todo quedará muy claro.

Cuerpo (familia de fuentes: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif;)

Veamos lo que estaba escrito:

Sistema operativo Windows: Arial;
OC Mac OS - Helvética CY;
OC Unix/Linux - Nimbus Sans L;
Familia genérica: sans-serif.

Las llamadas fuentes seguras

Basado en el sistema operativo Windows, se ha compilado una lista de varias fuentes seguras.

arial
Arial Negro
Cómic Sans MS
Mensajero nuevo
Georgia
Impacto
Times New Roman
Trabuquete MS
Verdana

Todas estas fuentes están instaladas en Mac OS X, Windows y muchos usuarios de Unix/Linux que tienen instaladas las fuentes Core para el paquete Web.

Para otros usuarios, se proporciona una tabla de correspondencia. Contiene fuentes similares que pertenecen a una familia específica.

Tabla de correspondencia y pertenencia de tipografías a una familia concreta:

ventanas	Mac OS	Unix/Linux	familia ancestral
Arial Negro	Helvética C.Y.	Nimbus Sans L	Sans-serif
arial	Helvética C.Y.	Nimbus Sans L	Sans-serif
Cómic Sans MS	Mónaco CY	* (vea abajo)	cursivo
Mensajero nuevo	* (vea abajo)	Nimbus Mono L	monoespacio
Georgia	* (vea abajo)	Libro escolar del siglo L	Serifa
Impacto	Carbón C.Y.	* (vea abajo)	Sans-serif
Times New Roman	Times CY	Nimbus Romano No9 L	Serifa
Trabuquete MS	Helvética C.Y.	* (vea abajo)	Sans-serif
Verdana	Ginebra C.Y.	DejaVu Sans	Sans-serif

* Al conectar fuentes, puede confiar en ellas con seguridad. La tabla admite caracteres cirílicos y el alfabeto ruso.
Tomé la tabla en sí en este artículo.

Conexión de fuentes del sistema al sitio.

Hay varias formas de conectar las fuentes del sistema a su sitio web. Además, puedes conectar diferentes fuentes a diferentes párrafos. Aplique diferentes fuentes a palabras y frases individuales. Ahora intentaré considerar todo esto.
Entonces, hagamos todo en orden.

Conexión de fuentes en un archivo CSS

Si necesitas conectarte fuente principal para todo el documento, sólo necesitas agregar el siguiente código a la hoja de estilo:

Cuerpo ( font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; /* conecta la fuente a todo el documento */ font-size: 16px; /* establece adicionalmente el tamaño de fuente */ font -weight: 400 /* establece el peso de la fuente, o en lugar de 400, establece el valor en normal */ )

Asignar una fuente para los títulos H1, H2, H3, H4, H5, H6 (aquí es lo mismo, solo configuramos el valor en negrita para resaltar los encabezados):

H1,h2,h3,h4,h5,h6( font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; /* conecta la fuente a los encabezados */ font-weight: 600; / * establezca el peso de la fuente, o en lugar de 600, establezca el valor en negrita */)

Asignamos una fuente solo a los párrafos:

P( font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; /* conecta la fuente a los párrafos, se puede aplicar a listas li, bloques div, formularios y otros elementos */ font-weight : normal; /* establece el peso de la fuente, o en lugar de 600, establece el valor en negrita */ font-size: 16px /* establece adicionalmente el tamaño de la fuente para los párrafos */ )

A asignar una fuente solo a un párrafo específico, o bloque, primero debes asignar una clase a este bloque en el documento HTML

Aquí hay un párrafo con una fuente personalizada.

Y en la tabla CSS escribe el siguiente código:

Font( font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; /* conectamos la fuente a ciertos párrafos, se puede aplicar a listas li individuales, bloques div, formularios y otros elementos */ font-weight: normal; /* establece el peso de la fuente, o en lugar de 600, establece el valor en negrita */ font-size: 16px /* establece adicionalmente el tamaño de fuente para los párrafos */ )

Ahora, a cada etiqueta, un elemento html con una clase .font (llámelo como quiera), se le asignará una fuente Arial, con negrita normal (400) y un tamaño de 16 píxeles.
De manera similar, puede asignar diferentes fuentes a listas li, tablas, bloques div completos, palabras individuales o frases.

Conexión de fuentes en un documento HTML

Las fuentes se incluyen directamente en un documento HTML del mismo modo que un archivo CSS, la única diferencia está en la sintaxis. Puede incluir fuentes en el encabezado del documento, entre etiquetas (similar a un archivo CSS) o en línea: asigna propiedades directamente a las etiquetas html.

Incluir fuentes en el encabezado, entre etiquetas . Para hacer esto, agregue el siguiente código al documento html:

No me repetiré aquí. Todo es similar a la conexión en el archivo CSS.

Conexión de fuentes en línea, directamente a los elementos del sitio. Déjame darte algunos ejemplos:

Conectando la fuente al párrafo.

Aquí hay un párrafo con texto.

Resaltamos una palabra separada en negrita y asignamos una fuente separada de la principal

Aquí hay un párrafo con texto, y este palabra, que debe resaltarse en negrita

Aquí está el enlace

De manera similar, asignamos fuentes a cualquier etiqueta html.

Pero sigue siendo mejor y recomendado asignar estilos a los elementos a través de un archivo CSS. En primer lugar, necesita escribir estilos en CSS solo una vez y luego asignar solo la clase requerida en HTML. En segundo lugar, al escribir estilos en línea, se crea contenido duplicado. Estas propiedades y clases parecen estar indexadas por los motores de búsqueda, y escuché que el W3C quiere abolir el sistema en línea por completo. Aunque a veces es más fácil escribir estilos de esta forma.

Todo. Siga las actualizaciones del sitio, estoy preparando un artículo sobre cómo conectar fuentes originales y no estándar al sitio para que se muestren correctamente en todos los navegadores. También te presentaré varios buenos servicios donde puedes elegir fuentes personalizadas.

Popular en la categoría: