块级元素是否支持文本溢出：省略号

Question

当文本溢出div时，我的文本没有用省略号切断。

通常这很容易实现，只需将text-overflow: ellipsis和overflow-x: hidden CSS属性添加到文本容器中即可。

如果您将<p>更改为<span>，则此功能正常。在谷歌搜索之后，看起来块和内联块元素都支持文本溢出：省略号。为什么会发生这种情况？

http://jsfiddle.net/p4j4326c/1/

HTML：

<div>
    <p>Test text that is going to overflow</p>
</div>

CSS：

div {
    width: 100px;
    overflow-x: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: 1px solid red;
}

Answer 1

看起来如果您修改了p标记，则可以使用

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

jsfiddle

这也来自MDN ......看起来它适用于块元素：

"This property only affects content that is overflowing a block container 
element in its inline progression direction."