css 文字超出隱藏顯示省略號(單行或多行)

2021-10-01 13:57:48 字數 422 閱讀 1979

單行的時候

overflow:hidden; //超出的文字隱藏

text-overflow:ellipsis; //溢位用省略號顯示

white-space:nowrap; //溢位不換行

倆行或以上時

overflow: hidden;

text-overflow: ellipsis; //溢位用省略號顯示

display:-webkit-box; //作為彈性伸縮盒子模型顯示。

-webkit-box-orient:vertical; //設定伸縮盒子的子元素排列方式--從上到下垂直排列

-webkit-line-clamp:2; //顯示的行

CSS文字超出隱藏顯示省略號

css文字超出隱藏顯示省略號 p style width 300px overflow hidden white space nowrap text overflow ellipsis 如果實現單行文字的溢位顯示省略號同學們應該都知道用text overflow ellipsis屬性來,當然還需要加...

css 文字超出隱藏並且顯示省略號

單行 overflow hidden 超出的文字隱藏 text overflow ellipsis 溢位用省略號顯示 white space nowrap 溢位不換行 多行需要加如下屬性 display webkit box 將物件作為彈性伸縮盒子模型顯示。webkit box orient ver...

CSS文字超出顯示省略號

white space nowrap overflow hidden text overflow ellipsis 但是因為兩個行內元素例如span一起的時候會出現一些間距,為了去掉這些間距我們可以給元素新增font size 0 但這樣做的話,會發現省略號消失了,但不新增font size 0 又...