什么是溢出显示
当输入的文本超出了元素的宽度或者高度的时候，此时，就是文本溢出。文本溢出我分为两大类，一类，高度的溢出显示，另一类，宽度的溢出显示。
高度溢出显示
首先是没有固定的高度，元素的高度就是文本的高度，但是文本太高也不是很美观，给一个最大高度，文本溢出显示滚动条。
.box{width:200px;max-height:100px;overflow-y:auto;}
其次是有固定高度，超出元素告诉，显示滚动条
.box{width:200px;height:100px;overflow-y:auto;}
宽度溢出显示
滚动条显示
.box{width:200px;height:200px;overflow-x:auto}// 固定宽度
.box{max-width:200px;height:200px;overflow-x:auto}//没有固定宽度
溢出显示省略号（一行）
.box{width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
溢出显示省略号（多行）
.box{width:100px,display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;}
注意，该方法适用于Webkit浏览器及移动端。
注释：
（1）-webkit-line-clamp用来限制在一个块元素显示的文本的行数。 为了实现该效果，它需要组合其他的WebKit属性。常见结合属性：
（2）display: -webkit-box; 必须结合的属性 ，将对象作为弹性伸缩盒子模型显示 。
（3）-webkit-box-orient 必须结合的属性 ，设置或检索伸缩盒对象的子元素的排列方式 。
