Как установить шрифт "полужирный" с помощью CSS? Шрифт-вес 600 не делает его похожим на полужирный, который я вижу в своем файле Photoshop


Я делаю Photoshop-to -XHTML преобразование, и дизайнер веб-сайта использовал шрифт Myriad Pro Semi-bold, который хорошо выглядит в файле photoshop, но когда я пытаюсь использовать полужирный вариант в CSS, он выглядит почти как обычный жирный шрифт, который слишком жирный для моей цели. Есть ли способ добиться более приятного полужирного шрифта в HTML и CSS или я просто застрял с " font-weight: 600;"?

5 52

5 ответов:

практический способ установки font-family к значению, которое является конкретным именем версии semibold, например

font-family: "Myriad pro Semibold"

если это имя. (Лично я использую свой собственный шрифт в листинге инструмент, который работает в Internet Explorer только для того, чтобы увидеть шрифты в моей системе по именам, которые можно использовать в CSS.)

при таком подходе font-weight не требуется (и, вероятно, лучше не устанавливать).

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

тестирование с помощью Segoe UI, который часто существует в разных версиях веса шрифта в системах Windows, я смог заставить Internet Explorer 9 выбрать правильную версию при использовании логического подхода (использования имени семейства шрифтов Segoe UI и другого font-weight значения), но это не удалось Firefox 9 и Chrome 16 (только нормальная и смелая работа). На всех этих браузерах, например, установка font-family: Segoe UI Light работает нормально.

в CSS для font-weight свойства, значение: normal по умолчанию используется числовое значение 400 и bold до 700.

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

например, вы бы определили полужирный шрифт следующим образом:

font-weight: 600;
теги JSFiddle используя семейство шрифтов "Open Sans", загруженное выше веса.

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

text-shadow : 0 0 0 #your-font-color;

font-family: 'Open Sans'; font-weight: 600; важно изменить на другой шрифт-family

к середине 2016 года Chromium engine (v53) поддерживает всего 3 стиля акцентов:

обычный текст, жирный, очень жирный...

 <div style="font:normal 400 14px Arial;">Testing</div>

 <div style="font:normal 700 14px Arial;">Testing</div>

 <div style="font:normal 800 14px Arial;">Testing</div>