Мне нужно сопоставить шрифт дизайнера с чем-то похожим для веба - PullRequest
1 голос
/ 01 сентября 2009

Я не знаю, является ли это спецификацией Illustrator или где именно, но дизайнер дал мне эту спецификацию для шрифта:

Helvetica Neue (T1), 35 тонких, 20 пт, выкл. / 454545, вкл. / 70a63a

Существуют и другие похожие для разных областей страницы, но если вы можете сказать мне, как сопоставить это с помощью CSS, надеюсь, я смогу разобраться с остальными.

Спасибо!

Ответы [ 3 ]

3 голосов
/ 01 сентября 2009

Это может быть затруднительно, поскольку только небольшое подмножество шрифтов поддерживается всеми браузерами, и МОЖЕТ выглядеть совершенно иначе в одном браузере, чем в другом (см. Шрифт типа Fantasy в Firefox против IE).

Вот некоторые CSS, чтобы вы начали, хотя

.myCss {font-family:Helvetica;font-size:20pt;font-weight:100;color:#454545}
.myCss:hover {color:#70a63a}

Font-weight, в современных браузерах поддерживает в основном NORMAL и BOLD. Но в новых браузерах они будут варьироваться от 100 до 900, при этом 700 - это сегодня BOLD, а 400 - это сегодня NORMAL.

ПРИМЕЧАНИЕ: Hover будет работать только с элементами ссылок в глупом IE 6, его поддержка НАМНОГО лучше в IE 7 и лучше в Firefox.

1 голос
/ 01 сентября 2009

Это позволит вам максимально приблизиться ко всем платформам:

font-family:Helvetica Neue, Helvetica, Arial, sans-serif;
font-weight:100;
font-size:20pt;
1 голос
/ 01 сентября 2009

Название шрифта - Helvetica Neue. T1 означает PostScript тип 1. 35 Тонкий - вес / вариация. 20 пт это размер. время от времени цвета.

Helvetica Neue (или Helvetica или Arial - все три очень похожи) присутствует практически на каждом компьютере. Тонкой вариации нет. Я рекомендую сделать семейство шрифтов Helvetica Neue, Helvetica, Arial, размер шрифта: 20pt и установить вес шрифта на минимально возможный: 100. Некоторые варианты Helvetica / Arial могут не иметь более легких вариаций веса шрифта, поэтому установка вес может ничего не делать.

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

...