首页 > Web开发 > 详细

CSS之文字溢出处理

时间:2019-05-03 10:24:27      阅读:125      评论:0      收藏:0      [点我收藏+]
1.单行文本之三剑客
<p>刘诗诗,原名刘诗施,1987年3月10日出生于北京市,中国内地影视女演员、影视出品人。</p>
p{
  border: 1px solid red;
  width: 400px;
  height: 40px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
当边框包不住文字时,首先使用nowrap属性设置为一行显示,文字溢出部分使用hidden把它隐藏,隐藏之后用“...”形式显示在文本框内。
p{
  border: 3px solid blueviolet;
  width: 500px;
  height: 40px;   //当高度不是行高的倍数时,有可能出现文字在边框线那边
  line-height: 20px;
  overflow: hidden;
}
技术分享图片

 

CSS之文字溢出处理

原文:https://www.cnblogs.com/combating/p/10804200.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!