首页 > 代码库 > css控制换行,断词

css控制换行,断词

word-break 属性规定自动换行的处理方法。

word-break:normal | break-all | keep-all;

  normal:使用浏览器默认的换行规则。

  break-all:允许在单词内折行。

  keep-all:只能在半角空格或连字符处换行。

<div style="word-break: break-all;">JavaScript,一種直譯式程式語言, 是一种动态类型、弱类型、基于原型的语言,内置支持類別。它的直譯器被稱為JavaScript引擎,為瀏覽器的一部分,廣泛用於客户端的腳本語言,最早是在HTML網頁上使用,用来给HTML網頁增加動態功能。然而现在JavaScript也可被用于网络服务器,例如:Node.js。JavaScript (/?d?ɑ?v??skr?pt/; JS) is a dynamic computer programming language.[5] It is most commonly used as part of web browsers, whose implementations allow client-side scripts to interact with the user, control the browser, communicate asynchronously, and alter the document content that is displayed.[5] It is also used in server-side network programming with frameworks such as Node.js, game development and the creation of desktop and mobile applications.</div>

 

word-wrap 属性允许长单词或 URL 地址换行到下一行。

word-wrap:normal | break-word;

  normal:浏览器默认处理的在断字点换行。

  break-word:在长单词或 URL 地址内部进行换行。

 

white-space 属性设置如何处理元素内的空白。

white-space:normal | pre | nowrap | pre-wrap | pre-line | inherit;

  normal:默认,空白会被浏览器忽略。。

  pre:空白会被浏览器保留。其行为方式类似 HTML 中的 pre 标签。  

  nowrap:文本不会换行,文本会在在同一行上继续,直到遇到 br 标签为止。

  pre-wrap:保留空白符序列,但是正常地进行换行。

  pre-line:合并空白符序列,但是保留换行符。

  inherit:从父元素继承 white-space 属性的值。

<div style="width:100px; white-space: nowrap;">    normal:默认,空白会被浏览器忽略。。      pre:空白会被浏览器保留。其行为方式类似 HTML 中的 pre 标签。        nowrap:文本不会换行,文本会在在同一行上继续,直到遇到 br 标签为止。      pre-wrap:保留空白符序列,但是正常地进行换行。      pre-line:合并空白符序列,但是保留换行符。      inherit:从父元素继承 white-space 属性的值。</div>

 

css控制换行,断词