Html word spacing normal

word-spacing

CSS-свойство word-spacing устанавливает длину пробела между словами и между тегами.

Интерактивный пример

Синтаксис

/* Значение ключевым словом */ word-spacing: normal; /* значения */ word-spacing: 3px; word-spacing: 0.3em; /* значения */ word-spacing: 50%; word-spacing: 200%; /* Глобальные значения */ word-spacing: inherit; word-spacing: initial; word-spacing: unset; 

Значения

Нормальный интервал между словами, определённый текущим шрифтом и/или браузером.

Определяет дополнительный интервал в дополнение к внутреннему интервалу между словами, определяемому шрифтом.

Определяет дополнительный интервал как процент от предварительной ширины символа.

Формальный синтаксис

Пример

HTML

div id="mozdiv1">Here are many words. div> div id="mozdiv2">. and many more!div> 

CSS

#mozdiv1  word-spacing: 15px; > #mozdiv2  word-spacing: 5em; > 

Проблемы доступности

Большое положительное или отрицательное значение word-spacing может сделать предложения, к которым применяется стиль, нечитаемыми. Для текста, стилизованного с очень большими положительными значениями, слова будут так далеки друг от друга, что он больше не будет казаться предложением. Для текста, стилизованного с очень большими отрицательными значениями, слова будут перекрывать друг от друга до точки, где начало и конец каждого слова будут неразличимы.

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

Спецификации

Начальное значение	normal
Применяется к	все элементы. Это также применяется к ::first-letter и ::first-line .
Наследуется	да
Проценты	зависит от ширины символа
Обработка значения	абсолютная length
Animation type	длина

Поддержка браузерами

BCD tables only load in the browser

Found a content problem with this page?

This page was last modified on 13 авг. 2022 г. by MDN contributors.

Your blueprint for a better internet.

Источник

CSS Text Spacing

In this chapter you will learn about the following properties:

• text-indent
• letter-spacing
• line-height
• word-spacing
• white-space

Text Indentation

The text-indent property is used to specify the indentation of the first line of a text:

Example

Letter Spacing

The letter-spacing property is used to specify the space between the characters in a text.

The following example demonstrates how to increase or decrease the space between characters:

Example

Line Height

The line-height property is used to specify the space between lines:

Example

Word Spacing

The word-spacing property is used to specify the space between the words in a text.

The following example demonstrates how to increase or decrease the space between words:

Example

White Space

The white-space property specifies how white-space inside an element is handled.

This example demonstrates how to disable text wrapping inside an element:

Example

The CSS Text Spacing Properties

Property	Description
letter-spacing	Specifies the space between characters in a text
line-height	Specifies the line height
text-indent	Specifies the indentation of the first line in a text-block
white-space	Specifies how to handle white-space inside an element
word-spacing	Specifies the space between words in a text

COLOR PICKER

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

CSS word-spacing Property

The word-spacing property allows changing the space between the words in a piece of text, not the individual characters.

This property can have either a positive or negative value. A positive value adds additional space between words, whereas a negative value removes the space between words. When the property is set to «normal», the defined font will specify the space between the words.

If you want to remove the space between inline block elements, you can set the white-space property to «zero».

The word-spacing property can be animatable with the transition property.

Initial Value	normal
AppliExamplees to	All elements. It also applies to ::first-letter and ::first-line.
Inherited	Yes.
Animatable	Yes. Word-spacing is animatable.
Version	CSS1
DOM Syntax	object.style.wordSpacing = «40px»;

Syntax

word-spacing: normal | length | initial | inherit;

Example of the word-spacing property with the «normal» value:

html> html> head> title>Title of the document title> style> .text < word-spacing: normal; > style> head> body> h2>Word-spacing property example h2> p class="text">Lorem ipsum is simply dummy text. p> body> html>

In the following example the space between the words is 20px:

Example of the word-spacing property specified in «px»:

html> html> head> title>Title of the document title> style> .text < word-spacing: 20px; > style> head> body> h2>Word-spacing property example h2> p class="text">Lorem ipsum is simply dummy text. p> body> html>

Result

Values

Value	Description	Play it
normal	Specifies normal word spacing. This is the default value of this property.	Play it »
length	Specifies an extra word spacing. Can be specified in px, pt, cm, em, etc. Negative values are valid.	Play it »
initial	Makes the property use its default value.	Play it »
inherit	Inherits the property from its parents element.

Browser support

Источник

word-spacing¶

Свойство word-spacing устанавливает интервал между словами.

Если для текста задано выравнивание через text-align со значением justify (выравнивание по ширине), то интервал между словами будет установлен принудительно, но не меньше значения, указанного через word-spacing .

Демо¶

• letter-spacing
• text-decoration
• text-decoration-color
• text-decoration-line
• text-decoration-style
• text-decoration-thickness
• text-decoration-skip
• text-decoration-skip-ink
• text-emphasis
• text-emphasis-color
• text-emphasis-position
• text-emphasis-style
• text-indent
• text-rendering
• text-shadow
• text-underline-position
• text-transform
• white-space
• word-spacing

Синтаксис¶

 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

/* Keyword value */ word-spacing: normal; /* values */ word-spacing: 3px; word-spacing: 0.3em; /* values */ word-spacing: 50%; word-spacing: 200%; /* Global values */ word-spacing: inherit; word-spacing: initial; word-spacing: unset; 

Значения¶

В качестве значений принимаются любые единицы длины, принятые в CSS — например, пикселы (px), дюймы (in), пункты (pt) и др. Значение может быть и отрицательным, но следует проверять работоспособность в разных браузерах. Процентная запись не применима.

normal Устанавливает интервал между словами как обычно.

Значение по-умолчанию: normal

Применяется ко всем элементам

Спецификации¶

Описание и примеры¶

 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

 html> head> meta charset="utf-8" /> title>word-spacingtitle> style> .tel  word-spacing: 10px; font-size: 2em; > style> head> body> p class="tel">Тел.: 555-221-061p> body> html> 

Источник