css样式使文字多余部分以省略号...显示

目录

• css样式使文字多余部分以省略号...显示
  • 单行文本:
    • 要添加的代码1：
    • 效果图1：
  • 多行文本：
    • 要添加的代码：
    • 效果图2：

css样式使文字多余部分以省略号...显示

单行文本:

要添加的代码1：

overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;

效果图1：

多行文本：

要添加的代码：

display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;	

效果图2：