文本溢出相关内容

1.单行文本溢出显示省略号

容器宽度：width：value；

强制文本在一行内显示:white-space：nowrap;

溢出内容为隐藏：overflow：hidden；

溢出文本显示省略号：text-overflow：ellipsis;

2.关于text-overflow属性

text-overflow:clip; 不显示省略号，而是剪裁掉多余的

text-overflow:ellipsis; 当单行文本溢出显示省略标记

3.关于white-space属性

white-space:normal(默认值)/

nowrap(文本不会换行，文本会在同一行上继续，直到遇到<br/>标签为止)/

pre(空白符会被保留，就是说浏览器可以识别空格)/

pre-line(会把多个空格合成一个，保留换行符)/

pre-wrap(保留所有空格，不会合并空格，正常的进行换行);

4.关于overflow属性

overflow:visible(默认值，内容不会被修剪，会呈现在元素框之外)/

hidden(内容会被修剪，且其余内容不可见)/

auto(如果内容被修剪，则浏览器会显示滚动条，以便查看其他内容)/

scroll(内容会被修剪，但是浏览器会显示滚动条，以便查看其余的内容);

5.多行文本溢出 显示省略号

-webkit-line-clamp: 3;  用来限制在一个块元素显示的文本的行数。

为了实现该效果，它需要组合其他的WebKit属性。常见结合属性：

display: -webkit-box; 必须结合的属性 ，将对象作为弹性伸缩盒子模型显示   

-webkit-box-orient: vertical/horizontal;必须结合的属性 ，设置或检索伸缩盒对象的子元素的排列方式 

overflow: hidden;

overflow:hidden;作用：清除高度塌陷

在规定的大小中隐藏超出部分的文本/图像