text-overflow

text-overflow 属性确定如何处理溢出其块容器的内联文本，通过指定如何向用户发送溢出文本。

也就是说，它允许你指定在文本溢出容器时显示什么。

文本只能在其内联进度方向上溢出块容器。当文本被容器阻止时（例如，由于 white-space：nowrap）或单个单词太长不适合时，文本可能溢出。

正如你可以看到，文本溢出其容器，但不会被剪辑或隐藏。 因此，没有任何附加样式，text-overflow 属性对元素没有影响。

为了使文本溢出工作，你需要剪切溢出其容器的文本。 这可以通过将元素的 overflow 属性设置为 hidden 来实现，或者设置为 visible 以外的任何值。 使用 overflow: hidden ，上面的元素变成：

当溢出被设置为隐藏时，文本被剪辑，并且字符可以仅被部分地渲染，如在上面的示例中可以看到的。 这是处理溢出文本的默认方式。 文本溢出的默认（初始）值是 clip。

现在，使用 overflow，你可以指定如何发信号或告诉用户一些文本溢出元素。

正如上面的图所展示的一样，可以使用省略号来告诉用户，这里的内容被省略了，而不是像上面的 overflow: hidden 一样，将其硬生生地切掉。

它的语法如下：

text-overflow: ( clip（默认） | ellipsis | ){1,2} | inherit

但是一般来说，我们需要用到下面三个属性一起，才能实现这样带省略号的效果：

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

也就是我下面的这样：

以上是原图，添加上面代码后，就称为以下的样式：

以上就是本节的内容啦。