Saltar al contenido

¿Cómo poner tipo de letra Arial en HTML?

¿Cómo poner tipo de letra Arial en HTML?

Font-family html

Artículo [email protected] regla at CSS @font-face especifica una fuente personalizada con la que mostrar el texto; la fuente puede cargarse desde un servidor remoto o una fuente instalada localmente en el propio ordenador del [email protected] {

DescripciónSi se proporciona la función local(), especificando un nombre de fuente a buscar en el ordenador del usuario, y el agente de usuario encuentra una coincidencia, se utiliza esa fuente local. En caso contrario, se descarga y utiliza el recurso de fuente especificado mediante la función url().

Al permitir que los autores proporcionen sus propias fuentes, @font-face hace posible diseñar contenidos sin estar limitados a las llamadas fuentes «web-safe» (es decir, las fuentes que son tan comunes que se consideran universalmente disponibles). La posibilidad de especificar el nombre de una fuente instalada localmente para buscarla y utilizarla hace posible personalizar la fuente más allá de lo básico, a la vez que permite hacerlo sin depender de una conexión a Internet.

Es común utilizar tanto url() como local() juntos, de modo que se utilice la copia instalada del usuario de la fuente si está disponible, volviendo a descargar una copia de la fuente si no se encuentra en el dispositivo del usuario.

Css font-size

Siempre debe incluir al menos un nombre de familia genérico en una lista de fuentes, ya que no hay garantía de que una fuente determinada esté disponible. Esto permite al navegador seleccionar una fuente alternativa aceptable cuando sea necesario.

La propiedad font-family especifica una lista de fuentes, de mayor a menor prioridad. La selección de fuentes no se detiene en la primera fuente de la lista que esté en el sistema del usuario. Más bien, la selección de fuentes se realiza carácter por carácter, de modo que si una fuente disponible no tiene un glifo para un carácter necesario, se prueban las últimas fuentes. Cuando una fuente sólo está disponible en algunos estilos, variantes o tamaños, esas propiedades también pueden influir en la familia de fuentes que se elija.Sintaxis/* Un nombre de familia de fuentes y un nombre de familia genérico */

Las familias de fuentes genéricas son un mecanismo de reserva, un medio para preservar parte de la intención del autor de la hoja de estilo cuando ninguna de las fuentes especificadas está disponible. Los nombres de familias genéricas son palabras clave y no deben citarse. Una familia de fuentes genérica debe ser el último elemento de la lista de nombres de familias de fuentes. Se definen las siguientes palabras clave:

Color de la fuente Html

Para personalizar por completo el aspecto de su sitio web, no puede olvidarse de la tipografía, es decir, de la forma de organizar y estilizar el texto. Dependiendo de su diseño, nicho de negocio y audiencia, puede querer cambiar el tipo de letra, el tamaño o el color de su fuente.

Por ejemplo, si prefieres el gris oscuro al negro en tu esquema de colores, entonces querrás cambiar el color de la fuente por defecto de tu texto. Si te dedicas a los medios de comunicación, puedes optar por una fuente sans serif, que se considera la tipografía más fácil de leer. Pero si estás en el campo creativo, entonces puedes optar por un tipo de letra decorativo como Morris Troy. Éstas son sólo algunas de las razones por las que puede querer estilizar el tipo de letra de su sitio web.

Para cambiar el tipo de letra en HTML, utiliza la propiedad CSS font-family. Ajústala al valor que desees y colócala dentro de un atributo de estilo. A continuación, añade este atributo de estilo a un elemento HTML, como un párrafo, un encabezado, un botón o una etiqueta span.

Antes podías utilizar simplemente la etiqueta font para cambiar el estilo del texto en HTML. Así que digamos que quieres cambiar tu fuente a Arial, tamaño 20px, y un bonito color naranja. Habrías escrito la siguiente línea de HTML:

Cara de la fuente Html

Nota del editor: Este tutorial sobre fuentes web en CSS se actualizó por última vez el 30 de junio de 2021 para eliminar información obsoleta sobre la compatibilidad de los navegadores con las fuentes variables. Todavía puede contener información que no esté actualizada.

En los primeros tiempos, los diseñadores estaban limitados a las fuentes populares del sistema, como Arial, Helvetica, Verdana y Times New Roman. El uso fiable de fuentes personalizadas sólo era posible con la sustitución de imágenes o con plugins como Flash.

Las fuentes del sistema operativo son gratuitas y pueden proporcionar un notable aumento del rendimiento. Cada plataforma difiere en los tipos de letra que ofrece, pero se pueden especificar las fuentes de reserva, así como los nombres genéricos de las familias de fuentes: serif, sans-serif, monospace, cursiva, fantasy, system-ui, etc.

Las aplicaciones web también pueden parecer más nativas si utilizan una fuente estándar del sistema. Por ejemplo, la siguiente pila implementada en GitHub tiene como objetivo las fuentes del sistema disponibles en las plataformas MacOS, iOS, Windows, Linux y Android:

Si un tipo de letra de sistema hace que su director de marketing se estremezca, hay varios repositorios que ofrecen una amplia gama de fuentes de código abierto que se sirven desde una red de distribución de contenidos (CDN). Las opciones más populares son:

Esta web utiliza cookies propias para su correcto funcionamiento. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Más información
Privacidad