在p标签的宽度内切片文本

Question

我有一个p tag with fix width.如果一个长句话出现,那么该句子应该自动切片,如下图所示.

所以这句话应该是这样的.

我试过很多Css选项,word-wrap and text-overflow但没什么用.有些会使宽度增加,有些则会产生其他问题.我也试过overflow:hidden,这隐藏了第二行,但没有添加...到第一行的末尾.

Answer 1

使用 :

p {
    text-overflow: ellipsis;
    display block;
    width: 100px;
    overflow: hidden;     
    white-space: nowrap;
    padding: 5px;
    border: solid 1px #000;
}

示例:http: //jsfiddle.net/ezywm/2/