Расстояние между словами в шрифте? - PullRequest
1 голос
/ 20 октября 2011

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

@font-face {
    font-family: 'BebasRegular';
    src: url('fonts/BEBAS___-webfont.eot');
    src: url('fonts/BEBAS___-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/BEBAS___-webfont.woff') format('woff'),
         url('fonts/BEBAS___-webfont.ttf') format('truetype'),
         url('fonts/BEBAS___-webfont.svg#BebasRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

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

Можно ли определить ширину между словами в объявлении font-face?

Ответы [ 2 ]

2 голосов
/ 27 марта 2018

Вы можете использовать unicode-range в объявлении @font-face, чтобы игнорировать пробел в шрифте.Браузер будет отображать пространство, используя запасной шрифт.

@font-face {
    font-family: 'BebasRegular';
    src: url('fonts/BEBAS___-webfont.eot');
    src: url('fonts/BEBAS___-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/BEBAS___-webfont.woff') format('woff'),
         url('fonts/BEBAS___-webfont.ttf') format('truetype'),
         url('fonts/BEBAS___-webfont.svg#BebasRegular') format('svg');
    font-weight: normal;
    font-style: normal;

    unicode-range: U+0000-001F, U+0021-007F;
}

Диапазон, указанный в последней строке: Базовая латиница (от U + 0000 до U + 007F), пропуская U+0020, который является пробелом.


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

1 голос
/ 20 октября 2011

Используйте свойство межстрочный интервал :

letter-spacing:2px;
...