CSS 仅检测HTML中的文本溢出？

Question

我已经看到了有关使用JavaScript来检测和处理溢出HTML元素的文本的建议。但是现在是2013年，所以我想知道CSS规范是否有办法检测溢出本身。

换句话说，如果我有固定大小的div：

<div class="smart-warning" style="width:200px; height:20px; overflow:hidden">
This is my very long text that would overflow the box.
</div>

我希望有一种样式，如果文本溢出，它会做一些事情，例如：

<style>
.smart-warning {
  border:1px solid black
}
.smart-warning:overflowing {
  border:1px solid red
}
</style>

看来我们真的很接近在CSS中拥有这样的东西，但是倾注规格不是我的工作。

如果不存在，您认为它会有用吗？

谢谢！

Answer 1

我不知道CSS规范的任何部分，如果可能的话。 Selectors Level 4支持许多新的伪类（以及用于检查输入元素上状态的相当多的伪类），但是这些伪类实际上都无法检查条件，例如是否盒子溢出。您仍然必须通过Javascript执行此操作。

Answer 2

之所以用CSS永远不可能，是因为这会导致自相矛盾。

请考虑以下内容：

.box {
    height: 100px;
}

.box:overflowing {
    height: 200px;
}

.content {
    height: 150px;
}

现在，如果盒子溢出了，它的高度为200px，这意味着它不再溢出，这意味着它的高度为100px，到现在意味着它已经溢出了，…

CSS *仅*检测HTML中的文本溢出？