Семейство шрифтов CSS отображается по-разному в Windows и Mac OS X - PullRequest
Новая
       8

Семейство шрифтов CSS отображается по-разному в Windows и Mac OS X

2 голосов
/ 28 июля 2011

По какой-то причине следующие два фрагмента кода отображаются корректно в Mac OS X, но полностью игнорируются в Windows, т. Е. Шрифт возвращается к Times New Roman с размерами и полями по умолчанию.Есть идеи, почему это может быть? 

body {
    font-family: "Helvetica Neue", "Lucida Grande", "Sans serif";
}

#div h1, p {
    margin: 0px;
    font-size: 14px;
    color: #333;
}

Ответы [ 3 ]

6 голосов
/ 28 июля 2011

попробуйте что-то вроде этого: 

font-family: "Helvetica Neue", "Lucida Grande", Helvetica, Arial, sans-serif;
6 голосов
/ 28 июля 2011

Без засечек с тире. Первые два шрифта, вероятно, не установлены на ПК с Windows (у меня их нет).

1 голос
/ 28 июля 2011

Согласно атрибуту font-family компьютер пытается найти шрифты Helvetica Neue, Lucida Grande и Sans serif.

Однако на ПК не установлены шрифты Helvetica Neue или Lucida Grande, и он не может найти запасной шрифт Sans serif, поскольку браузер по умолчанию имеет значение sans-serif, одно слово, без кавычек.

Как совет, вам следует попробовать добавить больше шрифтов без засечек, которые можно найти на компьютерах с Windows, например Lucida Sans, чтобы он не выглядел как ужасный по умолчанию шрифт без засечек Arial.

Ваши поля и размеры шрифта должны снова работать, хотя я предлагаю изменить font-size: 14px; на font-size: 1em; или font-size: 100%;, чтобы пользователи могли масштабировать шрифт, не разрушая макет.

Вот ваше исправление: 

body {
    font-family: "Helvetica Neue", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", sans-serif;
}

#div h1, p {
    margin: 0;
    font-size: 1em;
    color: #333;
}
...