给 css 文件名加一个 .module.css 后缀，编译后的 css 样式文件就会导出一个对象，为每个选择器起一个随机名字
// 文件名假设为 index.module.css
.box {
width: 50px
height: 50px
}
// 在这个文件中设置全局样式
:global(.active) { color: re
import React, { Component } from 'react'
// 引入自定义样式
import style from './index.module.css'
export default class Home extends Component {
render() {
return (
<div>
<p className={style.box}>home</p>
<p className="active">list</p>
</div>
)
}
}
明人不说暗话，直接上例子
由于富文本属于长文本，在页面上我们会有这种超出隐藏的功能需求，
如果是纯文本的话，我们大可以用slice截取字符串的方式来先显示几个字的方式，
但是由于富文本是由不同的html标签组成，这样的我们就会显得棘手。
如果我们不用蒙版遮罩的方式，就会变成这样
不做处理的话，就觉得比较生硬，所以用上了mask-image + linear-gradient 就会显得比较优雅。
这里只是用了mask-image的一些属性，当然mask-image能够做的不止这些，具体有兴趣的可以去摸索看看咯。
采用Iframe去解决这种问题，不只是重复抓取对服务器造成的压力，更严重的是搜索引擎抓取不到具体内容，影响收录。一般的标签，例如p、strong即使被截断也不会影响到布局的CSS，只是div这种标签可能会影响到。对于如何解决，其实你想多了，很简单，就是在发布内容的时候，全选，更改内容格式为段落（普通），而不是直接使用段落（div）。
