Automatically wrap lines in DIV_html/css_WEB-ITnose

word-break:break-all and word-wrap:break-word both enable the content of its container such as DIV to automatically wrap.

The difference between them is:

1, word-break:break-all For example, if a div is 200px wide, its content will automatically wrap at 200px. If there is an English word at the end of the line If it is very long (congratulation, etc.), it will truncate the word, and the end of the line will be conra (the front part of congratulation), and the next line will be the back part of tulation (conguatulation).

2. The word-wrap:break-word example is the same as above, but the difference is that it will congratulate the entire word as a whole. If the end of the line is not wide enough to display the entire word, it will automatically congratulate the entire word. Put it on the next line without truncating the word.

3, word-break;break-all Supported version: IE5 or above This behavior is the same as normal in Asian languages. Breaks within any word of a line of non-Asian language text are also allowed. This value is suitable for Asian text that contains some non-Asian text. WORD-WRAP:break-word Supported version: IE5.5 or above The content will be wrapped within the boundary. If necessary, word-break will also occur. The table automatically wraps to avoid stretching. word-break : normal | break-all | keep-all Parameters: normal : Allow line breaks within words according to text rules for Asian and non-Asian languages ​​break-all : This behavior is the same as normal for Asian languages. Breaks within any word of a line of non-Asian language text are also allowed. This value is suitable for Asian text that contains some non-Asian text keep-all : Same as normal for all non-Asian languages. For Chinese, Korean, and Japanese, word breaks are not allowed. Suitable for non-Asian text that contains a small amount of Asian text Syntax: word-wrap: normal | break-word Parameters: normal: Allow content to push against the specified container boundary break-word: Content will wrap within the boundary. If necessary, word-break also occurs. Description: Sets or retrieves whether to break the line when the current line exceeds the boundary of the specified container.

The corresponding script feature is wordWrap. Please see other books I have written. Syntax: table-layout: auto | fixed Parameters: auto: Default automatic algorithm. The layout will be based on the contents of each cell. The table will not be displayed until each cell is read and calculated. Very slow fixed: Fixed layout algorithm. In this algorithm, the horizontal layout is based only on the width of the table, the width of the table border, the cell spacing, and the width of the columns, and has nothing to do with the content of the table. Description: Set or retrieve the layout algorithm of the table. The corresponding script attribute is tableLayout.

Example:

.word_break {float:left;width:200px;margin:10px;padding:10px;font-size:16px;font-family:simsun;border:1px solid #242424;zoom:1;word-break:break-all;}