Question

我有一个div元素，它覆盖窗口的整个宽度和它内部的标签。标签会动态更改，有时其中的文本超出了div的边界。有一个例子：

white-space: nowrap

在div和label上都有

但它只是不起作用。我只是想知道是否可以缩小标签内的文本，使其符合父div的宽度。

如果您滚动并尝试在div的蓝色背景结束后选择某些内容，则可以看到标签超出了div。还有内容。

修改

我不是要缩小文本，而是要显示其内容的一部分，让我们说文本的开头。我不是要改变字体的大小，我只是想显示适合div内部的文本部分。

Answer 1

您似乎希望标签包装在父容器中？在这种情况下，white-space：nowrap将不起作用，这将导致标签文本超出父容器的边界而不包装到下一行。

因此，有两种方法可以执行此操作，或者将文本换行到下一行，以便标签保持在div的宽度内，或者使用以下CSS属性优雅地截断：

text-overflow: ellipsis;
overflow: hidden;