What to do with CSS overflow and line wrapping

First, overflow processing

1, processing blank

If the text is too long to display in the container, do you want to wrap it?

Property:white-space:normal/nowrap

Normal: use browser default settings

NoWrap: No Line break

2. Text Overflow

After overflow processing , If you want to hide the overflow content, you can consider the use of this property.

Note: This property must be associated with Overflow:hidden

Property : Text-overflow

Value :

1,clip , cut, waist truncation

2,ellipsis, through ... (ellipsis) to indicate what is not displayed

For example:

1. <! DOCTYPE HTML >

Two , line change

Note: only valid in English

1.Long Word wrapping

Word-wrap:

Normal: default, the browser default form, do not break the word structure

Break-word: Breaking the structure of words

2.Text Wrapping

Word-break:

Value:

Normal

Break-all: breaking word structure for line breaks

Keep-all: line wrapping under a space in the half-width state

<!        DOCTYPE HTML >