Как я могу использовать Helvetica Neue Condensed Bold в CSS?

Я хочу использовать Helvetica Neue Condensed Bold на моей веб-странице, но он, похоже, не работает. Я пробовал это: http://jsfiddle.net/ndFTL/, но он не работает, он просто отображается как Helvetica Neue Bold.

У меня установлен Helvetica Neue Condensed Bold: enter image description here

Может ли кто-нибудь помочь мне?

Ответы

Ответ 1

После большого количества попыток, он работал (только тестировался в Webkit), используя:

font-family: "HelveticaNeue-CondensedBold";

font-stretch был сброшен между CSS2 и 2.1, но вернулся в CSS3, но поддерживается только в IE9 (никогда не думал, что смогу сказать это о любом CSS-прокрутке!)

Это работает, потому что я использую имя postscript (найдите шрифт в Font Book, нажмите cmd + I), что является нестандартным поведением. Вероятно, стоит использовать:

font-family: "HelveticaNeue-CondensedBold", "Helvetica Neue";

В качестве резервной копии другие браузеры могут по умолчанию выполнять засечку, если они не могут ее решить.

Демо: http://jsfiddle.net/ndFTL/12/

Ответ 2

У меня была такая же проблема и проблема с ее работой во всех браузерах.

Итак, это лучший стек шрифтов для Helvetica Neue Condensed Bold, который я могу найти:

font-family: "HelveticaNeue-CondensedBold", "HelveticaNeueBoldCondensed", "HelveticaNeue-Bold-Condensed", "Helvetica Neue Bold Condensed", "HelveticaNeueBold", "HelveticaNeue-Bold", "Helvetica Neue Bold", "HelveticaNeue", "Helvetica Neue", 'TeXGyreHerosCnBold', "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif; font-weight:600; font-stretch:condensed;

Еще больше стеков для поиска по адресу:

http://rachaelmoore.name/posts/design/css/web-safe-helvetica-font-stack/

Ответ 3

Если кто-то все еще ищет Helvetica Neue Condensed Bold, у вас есть по два варианта.

  • fonts.com. Лицензируйте настоящий шрифт как webfont с сайта fonts.com. Бесплатно (с значком), 10 долларов США в месяц для просмотра страниц в 250 тыс. Страниц и 100 долл. США в месяц для просмотра страниц в 2,5 млн. Страниц. Вы можете загрузить шрифт на свой рабочий стол с самым дорогим планом (но если вы на Mac, у вас его уже есть).
  • myfonts.com/ fontspring.com: купите довольно близкую альтернативу, например Nimbus Sans Novus D от MyFont ($ 160 за неограниченные просмотры страниц), или Franklin Gothic FS Demi Condensed, с сайта fontspring.com(около $21,95, за один раз с неограниченным просмотром страниц). В обоих случаях вы также можете загрузить шрифт для своего рабочего стола, чтобы вы могли использовать его в Photoshop для comps.

Очень дешевым компромиссом является покупка Франклина из fontspring, а затем использование "HelveticaNeue-CondensedBold" в качестве предпочтительного шрифта в вашем CSS.

h2 {"HelveticaNeue-CondensedBold", "FranklinGothicFSDemiCondensed", Arial, sans-serif;}

Затем, если пользователь Mac загружает ваш сайт, они видят Helvetica Neue, но если они находятся на другой платформе, они видят Франклина.

ОБНОВЛЕНИЕ. Я обнаружил гораздо более близкое совпадение с Helvetica Neue Condensed Bold - это Nimbus Sans Novus D, сгибая жирный шрифт. Фактически, он также получен из Helvetica. Вы можете получить его на MyFonts.com за 20 долларов США (рабочий стол) и 20 долларов США (веб-страницы, 10 страниц). Интернет с неограниченным просмотром страниц составляет 160 долларов США. Я использовал этот шрифт повсюду (т.е. Не использовал Mac, встроенный в "NimbusSansNovusDBoldCondensed" вообще), поскольку он приводит к более однородному дизайну в браузерах. Построенные в HN и Nimbus Sans очень похожи во всех отношениях, но размер точки. Нимбус нуждается в нескольких дополнительных очках, чтобы получить одинаковый размер.

Ответ 4

"Helvetica Neue Condensed Bold" работает с firefox:

.class {
  font-family: "Helvetica Neue";
  font-weight: bold;
  font-stretch: condensed;
}

Но он не работает с Opera.

Ответ 5

Вам нужно было бы превратить ваш шрифт в веб-шрифт, как показано в этих SO-вопросах:

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

Одним из самых простых бесплатных и законных способов использования веб-шрифтов является Google Web Fonts. Однако, к сожалению, в их портфолио у них нет Helvetica Neue.

Одним из самых простых несвободных и законных способов является покупка шрифта из литейного производства, который предлагает веб-лицензии. Я знаю, что myFonts литейщик делает это; они даже дают вам полный пакет со всеми подготовленными JavaScript и CSS. Я уверен, что другие литейные заводы делают то же самое.

Изменить: MyFonts имеет Helvetica neue на складе, но, видимо, не с веб-лицензией. Проверьте этот список похожих шрифтов, некоторые из которых имеют веб-лицензию. Кроме того, Ray Larabie содержит несколько хороших шрифтов с веб-лицензиями, некоторые из них бесплатны.