css多行超出省略号（一行超出省略号）

多行超出显示省略号：

< style >

div

{

width: 400px;

height: 60px;

line-height: 30px;

margin: 0 auto;

border: 1px solid #ccc;

padding: 0 10px;

text-overflow: ellipsis;

display: -webkit-box;

-webkit-line-clamp: 2;

-webkit-box-orient: vertical;

overflow : hidden;

}

< / style >

< div >

你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀

div >

一行超出显示省略号

< style >

div

{

width: 400px;

margin: 0 auto;

border: 1px solid #ccc;

padding: 0 10px;

line-height: 30px;

height: 30px;

text-overflow: ellipsis;

white-space: nowrap;

overflow : hidden;

}

< / style >

< div >

你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀你好呀

div >