Css 如何在div元素中放置label元素

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

我试过了：

white-space: nowrap

在div和label上，但都不起作用。 我只是想知道是否有可能缩小标签内的文本，使其适合父div的宽度

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

编辑：

---

我不是想缩小文本，而是想展示部分内容，比如说文本的内容。我没有试图更改字体的大小，我只是想显示适合div的文本部分。

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

因此，有两种方法可以做到这一点，要么将文本换行到下一行，使标签保持在div的宽度内，要么使用以下CSS属性将其优雅地截断：

text-overflow: ellipsis;
overflow: hidden;

---

您只能使用Javascript，空格：nowrap不会更改字体大小。@Twan不使用Javascript是不可能的。我相信有一种更合理的方法可以代替使用脚本。如果您想缩小文本以适应您的分区，则不能。这只能通过Javascript来完成。@Twan我更新了我的答案。我并没有试图改变文本的大小。就像我下面的答案中所述，将此添加到您的css文件：#中间部分{overflow:hidden；}您的答案最接近我要查找的内容。我刚刚将父容器宽度从200px更改为100%，因为这是我在布局中需要它的方式。我现在试着给你一个答案，我只是想知道为什么不能在文本中添加左填充？