单行文本与多行文本的溢出处理
1.单行文本进行操作设置(只适合单行文本操作)
width:**px;设置高度才可以判断好文本的溢出范围。
overflow:hidden; 溢出的部分进行隐藏
text-overflow:ellipsis; 文字溢出的部分进行省略操作
white-space:nowrap; 元素强制不换行
white-space:
normal 空白会被忽略掉
pre 空白会被保留下来 类似于html的 pre
nowrap 文本不会换行,在同一行上继续,直到遇见<br>标签为止
pre-wrap 保留空白符号,但是能正常的进行换行
pre-line 合并空白的序列,但是保留换行符号。
lnherit 从父元素进行继承属性。
text-overflow:
clip 修改文字
ellipsis 用省略号来代替
string 使用给定的符号来代表被修剪的文本。
2.多行文本进行溢出处理
width:***px;进行宽度设置。
overflow:hidden; 溢出后进行隐藏。
text-overflow:hidden;文本超出后进行隐藏
display:-webkit-box;
-wedkit-line-clamp:3;控制多行文本的行数
-wedkit-box-orient:vertical; 从顶部向底部垂直布置子元素。
box-orien 指定一个box子元素是否应按照水平或垂直排列。
horizontal 制定一个子元素在水平线上从左到右排列
vertical 从顶部向底部垂直布置子元素
inline-axis 子元素沿着内联坐标轴(映射到横向)
block-axis 子元素沿着块坐标轴 (映射到垂直)
inherit 从父元素进行继承