css单行显示超出...

在CSS中，如果你想让文本在一行内显示，并且当超过容器宽度时自动省略并显示一个省略号("...")，你可以使用`overflow`和`text-overflow`属性配合`white-space`属性。以下是常见的做法：

1. 首先，设置`white-space`属性为`nowrap`，这使得文本保持在一个单词接一个单词的方式，不会换行。

   .single-line {
     white-space: nowrap;
   }

2. 然后，如果内容溢出容器，设置`overflow`属性为`hidden`隐藏多余的部分，同时使用`text-overflow`属性展示省略号。

   .single-line::text {
     overflow: hidden;
     text-overflow: ellipsis; /* 这里会显示省略号 */
   }

这样，只要内容超过容器宽度，就会在结尾处自动添加省略号，只显示到最后一行的内容。例如，如果你有一个class名为`.description`的元素，你可以在样式表中这样设置：

.description {
  width: 200px; /* 设置你的容器宽度 */
  .single-line { /* 继承上面的样式 */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}