word-spacingСвойство похоже letter-spacing, хотя , естественно , его использование определяет объем пространства между словами в части текста, а не отдельные символы.
p ( word-spacing: 2em; )word-spacing может принимать три разных значения:
- ключевое слово «normal», которое сбрасывает интервал по умолчанию
- значения длины с использованием любых единиц CSS (чаще всего px, em, rem)
- ключевое слово «наследование», которое применяет
word-spacingродительский элемент
Лучшей практикой в настоящее время было бы использовать em. Размер шрифта можно регулировать, поэтому использование пикселей для этого может вызвать проблемы, поскольку интервал между словами не масштабируется, как их размер. remобычно отлично, но поддержка браузером ниже, и в этом случае, вероятно, лучше всего, чтобы интервал имел отношение непосредственно к словам, к которым он применяется, а не к корню.
Важно отметить, что «слово» в этом контексте на самом деле относится к отдельному фрагменту встроенного контента, что означает, что оно word-spacingвлияет на inline-blockэлементы, а также на inlineэлементы. В этом примере несколько таких элементов разнесены путем установки word-spacingродительского контейнера:
Точки интереса
word-spacingСвойство анимируемое с CSS Transitions.- Хотя использование «процентного» значения для определения интервала разрешено в соответствии со спецификацией, оно может дать непредсказуемые результаты - часто просто никакого эффекта.
- Установка пустого пространства в ноль - один из способов борьбы с пробелом между встроенными блочными элементами.
Поддержка браузера
| Хром | Сафари | Fire Fox | Опера | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Работает | Работает | Работает | Работает | Работает | Наиболее | Работает |
Примечание о поддержке браузера Android: подавляющее большинство устройств Android поддерживают, word-spacingоднако некоторые устройства, использующие сборки Webkit, не принадлежащие Apple, или браузер Netfront, не поддерживают. Подробности подробно описаны в ссылке QuirksMode выше.