控制內(nèi)容字?jǐn)?shù)，多余省略號(hào)表示

{

width: 200px;?

white-space: nowrap;?//強(qiáng)制不換行　 （word-wrap:break-word; 強(qiáng)制連續(xù)字符換行）

overflow: hidden;

text-overflow:ellipsis;//?如果不想顯示省略標(biāo)記，將text-overflow設(shè)為clip

}

省略2或3行（ -webkit-line-clamp: 2/3;）

-webkit-line-clamp 是一個(gè) 不規(guī)范的屬性（unsupported WebKit property），它沒(méi)有出現(xiàn)在 CSS 規(guī)范草案中。
限制在一個(gè)塊元素顯示的文本的行數(shù)。 為了實(shí)現(xiàn)該效果，它需要組合其他外來(lái)的WebKit屬性。常見(jiàn)結(jié)合屬性：
display: -webkit-box; 必須結(jié)合的屬性 ，將對(duì)象作為彈性伸縮盒子模型顯示 。
-webkit-box-orient 必須結(jié)合的屬性 ，設(shè)置或檢索伸縮盒對(duì)象的子元素的排列方式 。
text-overflow，可以用來(lái)多行文本的情況下，用省略號(hào)“...”隱藏超出范圍的文本 。

語(yǔ)法

-webkit-line-clamp：<number>
默認(rèn)值： ? ?表示不清楚；
適用于：塊元素
繼承性：無(wú)
動(dòng)畫性：否
計(jì)算值：指定的值

取值

<number>：
塊元素顯示的文本的行數(shù)。
* CSS3新增屬性可能存在描述錯(cuò)誤及變更，僅供參考，持續(xù)更新

?

示例：（注意要設(shè)置固定高度，寬度可不限定）

{ font-size: 12px;line-height: 18px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;height:50px; }

總結(jié)

以上是生活随笔為你收集整理的ellipsis省略号表示多余内容的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。