html5 让显示不完的文字自动省略号 是什么属性

发布网友 发布时间：2022-04-20 14:54

我来回答

共2个回答

热心网友 时间：2022-04-20 11:34

p {
    -webkit-line-clamp: 3; // *显示的文本的行数为3
    -webkit-box-orient: vertical; // 水平排列<p>，使其不纵向显示
    word-break: break-all; // 使<p>中的文字换行
    overflow: hidden; // 超出的文字部分隐藏
    text-overflow: ellipsis; // 超出的文字部分用...来显示
    display: -webkit-box; // 将<p>变成高度定死，宽度自适应的行内块元素
}

<p>这里有很长的文字这里有很长的文字这里有很长的文字这里有很长的文字</p>

text-overflow: ellipsis 是变成省略号的选项，但其他属性须存在才能达到想要的效果。

热心网友 时间：2022-04-20 12:52

text-overflow:ellipsis