一行或多行文本超出区域用省略号表示

来源：互联网发布：中信国安大数据编辑：程序博客网时间：2024/06/06 08:25

<!DOCTYPE html><html>  <head>    <meta charset="utf-8">    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">    <meta name="format-detection" content="telephone=no">      <title></title>      <script type="text/javascript" src="js/jquery-1.10.1.min.js" ></script>      <style type="text/css"> div{display: -webkit-box;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 2;padding-left: 15px;padding-right:15px;box-sizing: border-box; }</style></head><body><span style="white-space:pre"></span><div> 多行文字超出长度省略，内容文字超出长度省略，内容文字超出长度省略，内容文字超出长度省略，内容文字超出长度省略，内容文字超出长度省略，内容文字超出长度省略，内容文字超出长度省略，内容文字超出长度省略，内容文字超出长度省略，内容文字超出长度省略</div></body></html>

这是超出两行省略

display: -webkit-box;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 2;padding-left: 15px;padding-right:15px;box-sizing: border-box;

行数是由这个控制的

-webkit-line-clamp: 2;

0 0