How to set word spacing in css

This article will explain in detail how to set word spacing in css. The editor thinks it is very practical, so I share it for you as a reference. I hope you can get something after reading this article.

In fact, the method of setting word spacing in css is very simple, you only need to use one property, and this is the word-spacing property.

The word-spacing attribute is actually similar to letter-spacing, but uses it to control the amount of space between words (words or Chinese characters) in a piece of text, not between individual characters.

Let's look at the use of the word-spacing attribute:

P {

Word-spacing:2em

}

Word-spacing can receive three different values:

1. The keyword "normal" is used to reset the default spacing

2. The value of any CSS unit of length (the most common is px,em,rem)

2. The "inherit" keyword, which applies the word-spacing parent element.

One of the best practices is to use CSS length units: em;, which resizes fonts. Using pixels can cause problems with the spacing between each word (word or Chinese character) because their size is not scaled; rem is usually good, but its browser support is low. In this use case, the best spacing is directly related to the word (word or Chinese character) it applies.

It is worth noting that in this case, "word" actually refers to a single inline content-which means that word-spacing affects inline-block elements and inline elements. In this example, several such elements are separated by setting the word-spacing 's parent container:

Description:

1. The word-spacing attribute can be animated through CSSTransitions.

1. Although the "percentage" value can be used to determine spacing according to the specification, it can produce unpredictable results (usually with no effect at all).

3. One way to eliminate the space between inline block elements is to set white-space to zero.

Note about mobile browser support: most mobile devices support the use of the word-spacing attribute, but some devices that use non-Apple versions of Webkit or Netfront browsers do not.

This is the end of the article on "how to set word spacing in css". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, please share it for more people to see.