Можно ли создать CSS для Mac OS, чтобы исправить разницу шрифтов? - PullRequest
Новая
       2

Можно ли создать CSS для Mac OS, чтобы исправить разницу шрифтов?

8 голосов
/ 16 января 2011

Я работаю над проектом с дизайнером, и он настоял на использовании какого-то определенного шрифта для заголовков и различных элементов на странице.Поэтому мы используем набор шрифтов для встраивания с @ font-face.

Он отлично работает на ПК (Firefox, IE 7 и 8, Chrome, Safari), но на Mac OS (Safari и Firefox) шрифтыне выровнены по вертикали.Посмотрев в Интернете, я не нашел никакого решения для этого, кроме «всегда были различия между браузерами и платформами, живите с ним».

Я знаю, что шрифты никогда не отображаются одинаково на разных платформах,но на этот раз это не то, что шрифт выглядит более жирным или что-то в этом роде.Шрифт выглядит так, как будто его базовый уровень совершенно отличается в Windows и Mac OS X. В Mac OS размер шрифта в 16px в 3 раза выше, чем на ПК.

Поэтому я ищу резервную копиюРешение: есть ли способ создать CSS специально для пользователей Mac OS?Я не хочу нацеливаться только на Safari, потому что Safari PC в порядке, а Firefox Mac не в порядке.

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

Спасибо!

Ответы [ 4 ]

13 голосов
/ 16 января 2011

Боюсь, что браузер / сниффинг - это ваш единственный выбор. Сам CSS не знает ОС и не слышал о взломе CSS, специально предназначенном для OSX.

Для меня это самый простой способ обнаружить OSX и добавить класс OSX в тело документа, чтобы вы могли переопределить стили CSS специально для OSX. 

if(navigator.platform.match('Mac') !== null) {
    document.body.setAttribute('class', 'OSX');
}
0 голосов
/ 24 января 2011

Если вы хотите быть практически безупречным и безболезненным, вам придется использовать обычные шрифты или шрифты из онлайн-сервиса, такого как бесплатная библиотека шрифтов Google или одна из платных библиотек шрифтов. Эти шрифты были разработаны и протестированы для работы в Интернете.

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

Если вам нужно анализировать браузер и обслуживать несколько таблиц стилей, на данный момент я бы сказал, что ваш дизайн поврежден и нуждается в пересмотре. Покажите https://fonts.google.com своему дизайнеру и посмотрите, нравится ли ему какой-либо из них - они работают кроссплатформенно во всех современных браузерах, а некоторые очень хороши. РЕДАКТИРОВАТЬ: Да, и они могут свободно использовать без забот о лицензировании.

0 голосов
/ 16 января 2011

Есть более простой способ. http://rafael.adm.br/css_browser_selector/

Он обнаруживает браузер и операционную систему и позволяет вам определять классы, специфичные для него.

0 голосов
/ 16 января 2011

Если установка явной высоты строки не устраняет проблему, вы можете подавать разные таблицы стилей для каждого браузера, используя ваш бэкэнд и определяя ОС в вашем приложении (через пользовательский агент).Вы также можете сделать что-то в JS, делая то же самое, но, скорее всего, будет FOUC, пока JS загружает соответствующие стили.

...