如何制作跨浏览器的CSS省略号？

Question

我用过这个

p.test {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;}

但它不适用于Firefox.我没有检查其他浏览器.

但我需要跨浏览器兼容

Answer 1

Firefox不支持它.

Firefox 3.x有一个解决方法,但这在FF4中也不起作用.

我被告知他们计划在FF6中添加支持.

截至目前,没有适用于Firefox的CSS解决方案.有些尝试已经成功地接近了一些东西,但实际上并没有什么是正确的.

有关更多信息,请参阅此问题:文本溢出:Firefox 4中的省略号？(和FF5)

我目前的解决方案是放弃省略号,而是做其他事情.我在文本元素的右侧使用淡出效果为用户提供类似的视觉提示作为省略号,它甚至可以与省略号结合使用,因此我们可以支持所有浏览器显示一些显示文本运行的效果,而不必诉诸任何浏览器黑客.

UPDATE按Ilee的回答:

由于text-overflow: ellipsis支持Firefox 7 .因此,它是主流浏览器的跨浏览器,例如从FF7,IE7和Chrome开始.

Answer 2

这篇文章已经过时了.从Firefox 7开始,它支持文本溢出:省略号.因此,它是主流浏览器的跨浏览器,例如从ff7,IE7和chrome开始.