. P1 {word-break: Break-all; width: 150px;}/* only applies to English letters. Use letters as the line feed basis */
. P2 {word-wrap: Break-word; width: 150px;}/* -- only applies to English. Use words as the line feed basis */
. P3 {white-space: Pre-wrap; width: 150px;}/* only applies to Chinese characters and forces line breaks */
. P4 {white-space: nowrap; width: 10px;}/* force do not wrap, all functions */
. P5 {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100px;} // * the excess part is hidden and appears as a ellipsis */
1. Word-break: Break-all; takes effect only in English and uses letters as the line feed basis.
2. Word-wrap: Break-word; only used for English. Use words as the basis for line feed.
3. {white-space: Pre-wrap; takes effect only for Chinese characters, force line feed
4. {white-space: nowrap; force line breaks.
5. {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; no line breaks. the excess part is hidden and appears as a ellipsis.
Note that you must specify the container width, otherwise it will be useless.
Note that word-break is ie5 + proprietary.
Syntax:
Word-break: normal | break-All | keep-all
Parameters:
Normal: line breaks are allowed according to the text rules of the Asian and non-Asian languages.
Break-ALL: this behavior is the same as that of the Asian language normal. It also allows non-Asian text lines to be broken in any word. This value is applicable to Asian texts that contain non-Asian texts.
Keep-ALL: same as normal in all non-Asian languages. Chinese, Korean, and Japanese cannot be disconnected. Suitable for non-Asian texts that contain a small number of Asian texts
Note:
Set or retrieve the line feed behavior of text in an object. Especially when there are multiple languages.
Use break-all for Chinese characters.