在CSS中，当文本内容长度超过某个指定宽度时，想要显示省略号（...）

在CSS中，当文本内容长度超过某个指定宽度时，想要显示省略号（…）代替溢出的部分，可以使用以下CSS样式：

对于单行文本：

.ellipsis {
  width: 200px; /* 设置一个固定的或最大宽度 */
  white-space: nowrap; /* 禁止文本换行 */
  overflow: hidden; /* 隐藏超出容器的文本 */
  text-overflow: ellipsis; /* 使用省略号代替隐藏的内容 */
}

上述代码会让.ellipsis类下的元素在内容过长时，在达到200像素宽度后，剩余部分以省略号显示。

对于多行文本，实现起来稍复杂一些，因为CSS本身不直接支持多行文本省略。不过，可以使用Webkit浏览器（如Chrome和Safari）的特定扩展属性来实现类似效果，以及结合Flex布局或者Grid布局进行模拟：

.multiline-ellipsis {
  display: -webkit-box;
  -webkit-line-clamp: 3; /* 指定最多显示的行数 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  
  /* 下面这一行是给其他浏览器的兼容性尝试，但并不完美，可能需要JavaScript辅助 */
  display: -ms-flexbox;
  -ms-flex-wrap: nowrap;
  -ms-flex-direction: column;
  -ms-line-clamp: 3;
  
  /* 其他样式，比如设置宽度或最大宽度 */
  max-width: 400px;
  line-height: 1.5;
  /* 添加...到最后一行 */
  &::after {
    content: '...';
    margin-left: 0.5em;
    display: block;
    text-align: right;
  }
}

请注意， -webkit-line-clamp 是非标准属性，目前并不是所有浏览器都支持，尤其在Firefox等非WebKit内核的浏览器中无法直接使用。为了跨浏览器兼容，可能需要借助JavaScript配合CSS或者其他更复杂的解决方案，例如使用伪元素结合绝对定位等方式实现。