微学网

热门关键词:   as  thinkphp  ecshop  xxx  商务通  php分页
热门: ASP.NET PHP编程 ASP编程 JSP编程 Python

css标题不换行文本超出隐藏显示省略号替代

发布时间:2020-03-17 来源:未知 点击:
我们经常会需要用到关于文本的换行,强制换行以及显示几行超过显示省略号等,今天我们就对这些问题来做个汇总吧!
 
1、自动换行
 
div{
   word-wrap:break-word;
   word-break:normal;
}
2、强制不换行
 
div{
   white-space:nowrap;
}
3、强制英文单词换行
 
div{
   word-break:break-all;
}
4、单行文本不换行多余文本显示省略号
 
div{
   width:200px;
   white-space:nowrap;
   overflow:hidden;
   text-overflow:ellipsis;
}
 
5、多行文本超出隐藏多余文本显示省略号
 
 
div{
   display:-webkit-box;
   overflow:hidden;
   text-overflow:ellipsis;
   -webkit-line-clamp:3;
   -webkit-box-orient:vertical;
}
 
6、table表格中单元格单行文本不换行
 
table{
   table-layout:fixed;
}
table tr td{
   width:60%;
   white-space:nowrap;
   overflow:hidden;
   text-overflow:ellipsis;
}

这就是微学网-程序员之家为你提供的"css标题不换行文本超出隐藏显示省略号替代"希望对你有所帮助.本文来自网络,转载请注明出处:http://www.weixuecn.cn/article/10570.html
网络编程 | 前端制作 | 数据库 | CMS教程 | 脚本编程 | 框架 | 服务器 | 微信开发 | APP开发 |

凡本网站转载的文章、图片等资料的版权归版权所有人所有,因无法和版权所有者一一联系,如果本网站选取的文/图威胁到您的权益,请您及时和本网站联系。 我们会在第一时间内采取措施,避免给双方造 成不必要的损失。
© 2015-2018 微学网 版权所有,并保留所有权利。 备案号:粤ICP备09051474号-1

电脑版 | 移动版