html - 仅 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 执行此操作。