When we set my div, or a fixed width of another text box, the text will overflow (shown outside the area without wrapping).
At this point we can use several of the CSS in the solution. There are three of the following that can solve the problem:
The 1,word-break property specifies how the wrap is handled.
Word-break:normal|break-all|keep-all;
Value Description
Normal uses the browser's default line-wrapping rule.
Break-all allows line wrapping within a word.
Keep-all can only wrap at half-width spaces or hyphens.
The 2,overflow property specifies what happens when the content overflows the element box.
Value Description
Visible default value. The content is not trimmed and is rendered outside the element box.
Hidden content is trimmed, and the rest is not visible.
Scroll content is trimmed, but the browser displays scroll bars to see the rest of the content.
Auto If the content is trimmed, the browser displays a scroll bar to view the rest of the content.
Inherit specifies that the value of the overflow property should be inherited from the parent element. The 3,white-space property sets how to handle whitespace within an element.
Value Description
Normal default. The blank will be ignored by the browser.
The pre blank is reserved by the browser. It behaves like a <pre> tag in HTML.
The nowrap text does not wrap, and the text continues on the same line until the <br> tag is encountered.
Pre-wrap preserves a sequence of whitespace characters, but wraps normally.
Pre-line merges a sequence of whitespace characters, but preserves newline characters.
Inherit specifies that the value of the White-space property should be inherited from the parent element.
I'm using Word-break:break-all to wrap the text, because our characters are Chinese, which causes a problem with the line change. Use overflow to make a scroll bar, if it is
Scroll bars are allowed to be used. White-space is a blank character in the text, if the text contains a lot of white space characters we can consider adding this attribute.
CSS---Resolve too much content will be out of text overflow (shown outside the area, do not wrap the case)