单行文本省略号以及多行文本省略号的写法

首先我们来讲一下单行文本省略号的写法，代码如下，前提必须给一个宽

1

overflow:hidden;

超出限定的内容就隐藏
2

white-space:nowrap

设置文字在一行显示，不能换行
3

text-overflow:ellipsis;

超出文本的内容用省略号代替

列如

 <p>我是一只小小小小鸟，想要飞却怎么飞也飞不高</p>

微信截图_20190628210808.png

接下来是多行文本省略号的代码，也得给一个宽

1

-webkit-line-clamp:2;

最多显示两行
2

display:-webkit-box;

弹性盒模型显示
3

-webkit-box-orient：vertical;

4

overflow:hidden;

超出限定的内容就隐藏

5

text-overflow:ellipsis;

裁剪超出的内容，这个可以省略，
列如

<p>那些年你很冒险的梦，我陪你去疯</p>

截图.png