时间戳

首页 > 解决方案 > 两行后省略

html - 两行后省略

问题描述

我想在两行之后省略我有一个解决方案，但它在 IE 浏览器中不起作用。

我想要这样：

Amazon Childproofs Echo 扬声器，添加适合年龄的音频内容......

标签： htmlcssreactjs

解决方案

body {
  padding: 50px;
}

.desc {
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -moz-line-clamp: 2;
  -ms-line-clamp: 2;
  -o-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  -ms-box-orient: vertical;
  -o-box-orient: vertical;
  box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  height: 40px;
  margin-bottom: 10px;
  margin-top: 10px;
  color: #333;
}
<div class="desc">
  textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt
  textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt
  textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt
  textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt
  textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt textt
</div>

推荐阅读