html中内容超出显示省略号的方法
本博客主要介绍 前端开发中文本过多，以省略号显示。
效果如图：
单行：
<!--单行--><p class="pl">这个属性定义溢出元素内容区的内容会如何处理。如果值为 hidden，当点击hidden时，滚动机制关闭，</p>
CSS
/*单行文本的溢出显示省略号*/.pl{width: 200px;overflow:hidden;text-overflow:ellipsis; background: goldenrod;white-space: nowrap;/*加宽度width属来兼容部分浏览*/}
多行：
<div id="p2">这个属性定义溢出元素内容区的内容会如何处理。如果值为 hidden，当点击hidden时，滚动机制关闭，内容会被修剪，但是浏览器不会显示供查看内容的滚动条，默认值是 visible。这是一个段落。这是一个段落。这是一个段落。这是一个段落。</div>
CSS
/*多行文本溢出显示省略号*/#p{width:220px;height:58px;overflow:hidden;text-overflow:ellipsis;background: greenyellow;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;/*-webkit-line-clamp是用来限制在一个块级元素内显示的文本行数，为了实现这个效果，需要结合其他-webkit属性。常见属性如下：display:-webkit-box;必须结合的属性，将对象作为弹性盒子模型显示。-webkit-box-orient:vertical;必须结合的属性,设置或检索伸缩盒子模型对象的子元素的排列方式。 */ }
