你的位置:首页 > 软件开发 > 网页设计 > 文字溢出隐藏,隐藏的问字用省略号表示

文字溢出隐藏,隐藏的问字用省略号表示

发布时间:2017-06-24 00:01:10
之前在写页面的时候用的都是单行文字溢出隐藏,今天遇到了多行文字溢出隐藏,溢出部分用省略号。我通过查阅一些资料整理了一下,拿出来与大家分享一下。  单行文本的溢出隐藏  对于单行文本溢出 隐藏,text-overflow: ellipsis 就能完美的解决,不过在使用他时,一定要结 ...

文字溢出隐藏,隐藏的问字用省略号表示

  之前在写页面的时候用的都是单行文字溢出隐藏,今天遇到了多行文字溢出隐藏,溢出部分用省略号。我通过查阅一些资料整理了一下,拿出来与大家分享一下。

  单行文本的溢出隐藏

  对于单行文本溢出 隐藏,text-overflow: ellipsis 就能完美的解决,不过在使用他时,一定要结合  overflow: hidden和   white-space: nowrap;,我有时就忘记写了,导致效果出不来,还让我找了半天。

 1 <!DOCTYPE html> 2 <html> 3 <head> 4   <meta charset="UTF-8"> 5   <title>单行文本溢出隐藏</title> 6   <style> 7     div{ 8       width: 200px; 9       height: 300px;10       border: 1px solid cyan;11       overflow: hidden;/*溢出隐藏*/12       white-space: nowrap;/*文字不换行*/13       text-overflow: ellipsis;/*溢出用省略号代替*/14     }15   </style>16 </head>17 <body>18 <div>19   <div>凭借专业的精神、优质的团队、周到的服务,东方卓越现已成为众中国银行业协会、中国航空运输协会、中国工商银行、中国建设银行、凤凰网、联想(北京)、中国人保等知名企业的合作伙伴,服务领域涵盖金融证券、汽车产业、时尚传媒、互联网、地产家居、旅游娱乐等重点领域。</div>20 21 </div>22 </body>23 </html>

原标题:文字溢出隐藏,隐藏的问字用省略号表示

关键词:

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

可能感兴趣文章

我的浏览记录