CSS text wrapping, cropping

Some CSS properties for wrapping and cropping

Word-wrap:normal | Break-word

Normal line wrap, content can break container, such as long word or long number of cases

Break-word Word as the basis for the line, if necessary, the word inside allowed to break

Word-break:normal | Break-all | Keep-all

Normal line wrap, content can break container, such as long word or long number of cases

Break-all the letter as the basis for wrapping

Keep-all the same as normal in Chinese and English

White-space:normal | | Pre | | nowrap | | Pre-line | | Pre-wrap | | Inherit

Normal default value, white space is ignored by the browser

The pre whitespace is retained by the browser, behaving in a way similar to the <pre> tags in HTML

nowrap text does not wrap, text will be on the same line until <BR/> tag is encountered

Pre-wrap preserves a sequence of whitespace characters but normally wraps (ie7-not supported)

Pre-line the sequence of whitespace characters, but preserves line breaks (ie7-not supported)

Inherit the value of the White-space attribute should be inherited from the parent element (ie not supported)

Application:

Text overflow shows ellipsis (...). ）：

text-overflow:ellipsis;
Overflow:hidden;
White-space:nowrap;

Word Wrapping:

* * to the word as the basis for line Word-wrap:break-word * *

;
Word-break:normal;

* * to the letter as the basis for line Word-break:break-all * *

;

Text forces no Line wrapping:

White-space:nowrap;