亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

淺析word-break work-wrap的區(qū)別

  發(fā)布時間：2016-08-05 08:56:46   作者：佚名   我要評論
下面小編就為大家?guī)硪黄獪\析word-break work-wrap的區(qū)別。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧

word-break:【斷詞】

定義：規(guī)定自動換行的處理方法.   注：通過word-break使用，可以實現(xiàn)讓瀏覽器在任意位置換行。

語法：word-break: normal|break-all|keep-all;

默認值 normal
繼承性 yes
版本 css3
Javascript語法 object.style.wordBreak="keep-all"

 

值 描述
normal 使用瀏覽器默認的換行規(guī)則。
break-all 允許在單詞內(nèi)換行。
keep-all 只能在半角空格或連字符處換行。

兼容性：

舉個栗子：

CSS Code復制內(nèi)容到剪貼板
  1. <span class="text-s">iIanishttp://3iuiuskjfksjj.com/test_abjcljlj/?daydayupdadyda=dayayupupdaalurupsjlsjfljlsfjljljouwrouowurouorwurouurowurouwruwouour</span>    
  2. .text-s {    
  3.     display: inline-block;    
  4.     width: 240px;    
  5.     // word-break: keep-all;    
  6. }    

未設置word-break：

 

設置word-break:break-all;

 

設置word-break:keep-all;或者word-break:normal;

 

word-wrap:【換行】

 定義：允許長單詞或 URL 地址換行到下一行。

語法:word-wrap: normal|break-word;

默認值： normal
繼承性： yes
版本： CSS3
JavaScript 語法：

object.style.wordWrap="break-word"

 

值 描述
normal 只在允許的斷字點換行（瀏覽器保持默認處理）。
break-word 在長單詞或 URL 地址內(nèi)部進行換行。

 

兼容性：

舉個栗子：【和上面一樣】

未設置word-wrap：

 

 

設置word-wrap:normal;

 

設置word-wrap:break-word;

 

對比上述栗子設置word-break:break-all;和word-wrap:break-word的差別

 

總結(jié)：

word-break:當行尾放不下一個單詞時，決定單詞內(nèi)部怎么擺放 => 決定句子末尾放不下單詞時，單詞是否換行

    break-all：強行擺放，擠不下剩下的就換下一行顯示。

    keep-all：放不下，就另外起一行展示；如果還放不下就溢出顯示。

word-wrap：當行尾放不下時，決定單詞內(nèi)是否允許換行 => 決定單詞內(nèi)該怎么換行

    normal：單詞太長，換行顯示，在超過一行就溢出顯示。

    break-word：當單詞太長時，先嘗試換行；換行后還是太長，單詞內(nèi)還可以換行。

 

附加一個：文字兩端對齊

屬性：text-align:justify;

兼容性：十分不好

 

text-align:center;

text-align:justify;

以上這篇淺析word-break work-wrap的區(qū)別就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

相關文章

最新評論