字数超出隐藏显示（多行隐藏显示问题）

最新推荐文章于 2023-09-14 20:31:49 发布

weixin_34388207

最新推荐文章于 2023-09-14 20:31:49 发布

阅读量519

点赞数

文章标签： javascript xhtml ViewUI

原文链接：http://www.cnblogs.com/simpleJokerKing/p/7591946.html

版权

代码：字数超出隐藏显示（多行隐藏显示问题）

注：只是适用webkit浏览器

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
 2 <html xmlns="http://www.w3.org/1999/xhtml">  
 3 <head>
 4     <script type="text/javascript">
 5         window.onload = function () {
 6             var p = document.getElementsByTagName("p")[0];
 7             var text = p.innerText;
 8             p.setAttribute('title',text);
 9         }
10     </script>
11     <style>  
12         .main_box  
13         {  
14             background: #EEE;  
15             width: 410px;  
16             height: 3em;  
17             margin: 1em;  
18         }  
19         .main_box p  
20         {  
21            overflow : hidden;
22            text-overflow: ellipsis;
23            display: -webkit-box;
24            -webkit-line-clamp: 2;/*表示允许显示的最大行数（剩下的内容用...代替）*/
25            -webkit-box-orient: vertical;
26         }  
27     </style>  
28 </head>  
29 <body>  
30     <div class="main_box">  
31         <p title="">  
32             豫章故郡，洪都新府。星分翼轸，地接衡庐。襟三江而带五湖，控蛮荆而引瓯越。物华天宝，龙光射牛斗之墟；人杰地灵，徐孺下陈蕃之榻。雄州雾列，俊采星驰。台隍枕夷夏之交，宾主尽东南之美。都督阎公之雅望，棨戟遥临；宇文新州之懿范，襜帷暂驻。十旬休假，胜友如云；千里逢迎，高朋满座。腾蛟起凤，孟学士之词宗；紫电青霜，王将军之武库。家君作宰，路出名区；童子何知，躬逢胜饯。
33             时维九月，序属三秋。潦水尽而寒潭清，烟光凝而暮山紫。俨骖騑于上路，访风景于崇阿；临帝子之长洲，得天人之旧馆。层峦耸翠，上出重霄；飞阁流丹，下临无地。鹤汀凫渚，穷岛屿之萦回；桂殿兰宫，即冈峦之体势。
34         </p>  
35     </div>  
36 </body>  
37 </html>