Css code of forced line breaking and non line breaking in chinese and english

web front end seven thousand nine hundred and sixty-one 13 years ago (2011-06-09)

HTML structure:
<p class="one">1. It only works for English and uses letters as the basis for line breaking</p>
<p class="two">2. It only works for English and uses words as the basis for line breaking</p>
<p class="three">3. Works only for Chinese, forcing line breaks</p>
<p class="four">4. Force no line break, all work</p>
<p class="five">5. No line breaks, the excess part is hidden and appears in the form of ellipsis</p>
<p class="five">6. No line breaks, the excess part is hidden and appears in the form of ellipsis</p>

CSS code:
. one {word break: break all; width: 150px;}/* Only works for English, using letters as the basis for line breaking*/
. two{word wrap: break word; width: 150px;}/* -- only works for English, with words as the basis for line breaking*/
. thread {white space: pre wrap; width: 150px;}/* Works only for Chinese, forcing line breaks*/
. four {white space: nowrap; width: 10px;}/* Force no line breaks, both of which work*/
. five {white space: nowrap; overflow: hidden; text overflow: ellipsis; width: 100px;} //* No line break, the excess part is hidden and appears in the form of ellipsis*/

1. word-break:break-all; It only works for English and uses letters as the basis for line breaking

2. word-wrap:break-word; It only works for English, with words as the basis for line breaking

3. {white space: pre wrap; works only for Chinese, forcing line breaks

4. {white space: nowrap; forcing no line breaks works

5. {white space: nowrap; overflow: hidden; text overflow: ellipsis; no line break, the excess part is hidden and appears in the form of ellipsis

Note that you must specify the width of the container, otherwise it is useless.

Note that word break is a proprietary attribute of IE5+

Syntax:

word-break : normal | break-all | keep-all

Parameters:

Normal: According to the text rules of Asian and non Asian languages, line breaks are allowed within words

Break all: This behavior is the same as normal in Asian languages. It also allows disconnection within any word in non Asian languages. This value is suitable for Asian texts containing some non Asian texts

Keep all: the same as normal in all non Asian languages. For Chinese, Korean and Japanese, word disconnection is not allowed. Suitable for non Asian texts containing a small number of Asian texts

explain:

Sets or retrieves the inline newline behavior of text within an object. Especially when there are multiple languages.

For Chinese, break all should be used.