由于富文本属于长文本，在页面上我们会有这种超出隐藏的功能需求，
如果是纯文本的话，我们大可以用slice截取字符串的方式来先显示几个字的方式，
但是由于富文本是由不同的html标签组成，这样的我们就会显得棘手。
如果我们不用蒙版遮罩的方式，就会变成这样
不做处理的话，就觉得比较生硬，所以用上了mask-image + linear-gradient 就会显得比较优雅。
这里只是用了mask-image的一些属性，当然mask-image能够做的不止这些，具体有兴趣的可以去摸索看看咯。
1、默认情况，它是自动换行的；
2、设置文字不换行white-space:nowrap，强行撑开；
3、如果不希望容器被撑开，那就给文字加省略号：
<style type="text/css">.divbox{ width:150px white-space:nowrap overflow:hidden text-overflow:ellipsis}
</style>
</head>
<body>
<div class="divbox">文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字</div>
</body>
需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的<style>标签中，输入css代码：
div{
width: 100px
overflow:hidden
text-overflow:ellipsis
display:-webkit-box
-webkit-box-orient:vertical
-webkit-line-clamp:2
}
3、浏览器运行index.html页面，此时文字超过2行会自动把多余部分用省略号显示 。
