欧美一区二区三区,国内熟女精品熟女A片视频小说,日本av网,小鲜肉男男GAY做受XXX网站

css中省略號的寫法

錢瀠龍2年前10瀏覽0評論

CSS中省略號是一種常用的樣式效果,可以用于截?cái)噙^長的文本,在界面上只顯示部分內(nèi)容,同時(shí)在文本末尾加上省略號。

省略號的寫法主要有兩種,分別是單行文本溢出的省略號和多行文本溢出的省略號。

/* 單行文本溢出省略號 */
.single-line {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* 多行文本溢出省略號 */
.multi-line {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;  /* 顯示行數(shù) */
overflow: hidden;
text-overflow: ellipsis;
}

單行文本溢出省略號需要設(shè)置三個(gè)樣式屬性,分別是overflow、text-overflow和white-space。其中overflow用于控制文本內(nèi)容超出容器大小時(shí)的顯示情況,text-overflow則用于控制文本末尾部分的省略號,white-space則用于控制文本在容器中顯示的方式。

多行文本溢出省略號則需要借助-webkit-box系列樣式屬性來實(shí)現(xiàn),其中-webkit-box-orient用于控制文本排列方向,-webkit-line-clamp用于控制顯示的行數(shù),overflow和text-overflow則用于控制文本超出部分的省略號。

以上是CSS中省略號的寫法和應(yīng)用方法,可以根據(jù)具體情況選擇單行或多行文本溢出省略號,從而實(shí)現(xiàn)更好的樣式效果。