本文推薦2種方法。
tip：只相容chrome核心的瀏覽器。ff不支援。
.box關鍵字描述
預設值值
word-wrap
規定單詞換行的條件
normal, 在單詞斷字點處換行。
break-word，在單詞內換行。
overflow-wrap,在css3時由word-wrap改為overflow-wrap
text-overflow
關鍵字描述
預設值值
test-overflow
超出盒子的文字如何顯示
clip, 修剪文字。 ellipsis, 顯示省略號。 string, 顯示指定的文字。
white-space
關鍵字描述
預設值值
white-space
對待空白的方法和是否換行
normal，空白會被瀏覽器忽略。
pre, 保留空白。nowrap, 文字不換行。pre-wrap, 保留空白，正常換行。pre-line，合併空白，保留換行。
box-orient
這個屬性還沒有被瀏覽器支援。需要使用各自瀏覽器的私有屬性。
關鍵字描述
預設值值
box-orient
子元素如何排序
inline-axis，子元素沿著內聯座標軸（對映到橫向）。
horizontal, 指定子元素在乙個水平線上從左到右排列。vertical, 從頂部向底部垂直排列子元素。block-axis, 子元素沿著塊座標軸（對映到垂直）。inherit，繼承父元素。
line-clamp
只有chrome核心的瀏覽器支援自己的私有屬性。
顯示多少行塊級元素。
名稱鏈結
ellipsis 鏈結
ellipsis
ellipsis git
1、 引入指令碼檔案
var ell = ellipsis()
var ele = document.getelementsbyclassname('test')
ell.add(ele)
多行文字溢位顯示省略號
這裡是i喵醬,這個是乙個多行超出換行的小demo,看這裡看這裡 overflow hidden 內容會被修剪，超出隱藏。text overflow ellipsis 超出範圍顯示 display webkit box 把物件轉換成彈性盒模型 webkit box orient vertical 設定...
多行文字溢位顯示省略號
大家應該都知道用text overflow ellipsis屬性來實現單行文字的溢位顯示省略號 當然部分瀏覽器還需要加寬度width屬性。css overflow hidden text overflow ellipsis white space nowrap 但是這個屬性並不支援多行文字溢位顯示省...
多行文字溢位顯示省略號
大家應該都知道用text overflow ellipsis屬性來實現單行文字的溢位顯示省略號 當然部分瀏覽器還需要加寬度width屬性。overflow hidden text overflow ellipsis white space nowrap 但是這個屬性並不支援多行文字溢位顯示省略號，這...