В какой степени семейства шрифтов совместимы во всех браузерах?

Question

Верно следующее:

1. Я установил font-family на элементе как sans-serif. Мой (Chrome) шрифт без засечек - Helvetica. Есть вероятность, что эта веб-страница при открытии в другом браузере с потенциально другой операционной системой будет отображать другой font-family, поскольку его шрифт без засечек font-family может отличаться от моего, например, cailbri

2. Семейство шрифтов, такое как Helvetica, является универсальным семейством шрифтов, которое отображает одинаковые (размеры) во всех браузерах.

Answer 1

Лучший способ гарантировать, что один и тот же шрифт используется во всех браузерах, - это не просто установить для font-family общее c значение (например, sans-serif), а использовать @import или <link rel="stylesheet" href="font.css" /> в вашем коде HTML. В части ссылки href и после @import вы должны поместить URL-адрес вашего шрифта. Например, если я хочу использовать шрифт «Ubuntu» (который также является именем дистрибутива Linux), и этот шрифт обслуживается Google Fonts, сделайте следующее:

CSS:

@import url(https://fonts.googleapis.com/css2?family=Ubuntu&display=swap)

HTML:

<link href="https://fonts.googleapis.com/css2?family=Ubuntu&display=swap" rel="stylesheet" />

Затем вы можете в своем CSS (для шрифта «Ubuntu») сделать это:

font-family: "Ubuntu", sans-serif; /* It is always smart to add the type of font at the end. In this case, sans-serif */

Это гарантирует, что все браузеры, которые читают HTML и CSS, могут использовать этот шрифт, и что он не будет отличаться в разных браузерах.

Answer 2

Первое верно. На самом деле, без засечек - это большое семейство шрифтов. Если у пользователя (1) нет желаемого шрифта на своем компьютере или (2) пользователь установил предпочитаемый шрифт в настройках своего браузера, шрифт будет другим.

Второй может быть правдой, но крайний пример: пользователь удаляет шрифт Helvetica со своего компьютера. Некоторые из способов избежать проблемы: (1) установить резервный шрифт или (2) запросить шрифт в Интернете, например font.googleapis.com.