Home  >  Article  >  Web Front-end  >  css automatic line wrapping

css automatic line wrapping

WBOY
WBOYOriginal
2016-10-19 10:19:271049browse

Method 1: First fix the width of the table, that is, give the table a width value (numeric value, not percentage)

Method 2: Force no line breaks

 div{//white-space: no line wrapping; normal default; nowrap forces all text to be displayed in the same line until the end of the text or encounters the br object white-space:nowrap; }

Method 3: Automatic line wrapping

 div{ word-wrap: break-word; //word-break sets forced line break; normal text rules for Asian and non-Asian languages, allowing line breaks within words word-break: normal; }

Method 4: Force line breaks for English words

 div{word-break:break-all;}

Note:

Define the following sentence in CSS to prevent the web page from being "stretched":

 table{table-layout: fixed;}td(word-break: break-all; word-wrap:break-word;)

Prevent tables/layers from being "expanded" while ensuring that single English words will not be split when branching:

 table { table-layout: fixed;word-wrap:break-word;}

 div { word-wrap:break-word;}

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article:Native JS---3Next article:Native JS---3