css xx行超出省略號

2022-07-11 04:24:09 字數 512 閱讀 5161

.line-clamp1

兩行超出

.line-clamp2

前提  :設定乙個寬度 

目前沒有瀏覽器支援 box-orient 屬性。

firefox 支援替代的 -moz-box-orient 屬性。

safari、opera 以及 chrome 支援替代的 -webkit-box-orient 屬性。

box-orient 屬性規定框的子元素應該被水平或垂直排列。值描述

horizontal

在水平行中從左向右排列子元素。

vertical

從上向下垂直排列子元素。

inline-axis

沿著行內軸來排列子元素(對映為 horizontal)。

block-axis

沿著塊軸來排列子元素(對映為 vertical)。

inherit

應該從父元素繼承 box-orient 屬性的值。

參考c3  

文字超出省略號型別

overflow hidden 超出的文字隱藏 text overflow ellipsis 溢位用省略號顯示 white space nowrap 溢位不換行overflow hidden text overflow ellipsis display webkit box 作為彈性伸縮盒子模型顯示...

文字超出省略號之前後省略號實現

標籤 css js 最近在做聊天記錄需求時,對於查到的訊息體需要高亮顯示,前後內容超出需要顯示省略號,效果如下圖 對於後省略號是可以通過的一串css來實現的,主要是css的 段如下 css省略號 段 overflow hidden text overflow ellipsis position re...

css 文字超出省略號,單行省略號和多行省略號

doctype html en utf 8 viewport content width device width,initial scale 1.0 document title html,body width 1000px padding 50px 30px margin 50px auto b...