码迷，mamicode.com
首页 > 其他好文 > 详细

文本出现省略号

时间：2018-04-11 11:36:07      阅读：179      评论：0      收藏：0      [点我收藏+]

标签：ips   play   lips   AC   ext   ext1   元素   flow   浏览器   

一行的时候
.text1 {
        width:200px;
        overflow:hidden;
        text-overflow:ellipsis;                  
        -o-text-overflow:ellipsis;
        -webkit-text-overflow:ellipsis;
        -moz-text-overflow:ellipsis;
        white-space:nowrap;
}
 
规定段落中的文本不进行换行：
p
{white-space: nowrap}
 
可能的值
normal 默认。空白会被浏览器忽略。
pre 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
nowrap 文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。
pre-wrap 保留空白符序列，但是正常地进行换行。
pre-line 合并空白符序列，但是保留换行符。
inherit 规定应该从父元素继承 white-space 属性的值。
 
技术分享图片
二行的时候
.text2 {
        width:200px;
        word-break:break-all;
        display:-webkit-box;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical;
        overflow:hidden;
}
 
 
 
技术分享图片

文本出现省略号

标签：ips   play   lips   AC   ext   ext1   元素   flow   浏览器   

原文地址：https://www.cnblogs.com/quitpoison/p/8794268.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！