码迷,mamicode.com
首页 > Web开发 > 详细

CSS之文字溢出处理

时间:2019-05-03 09:57:04      阅读:192      评论:0      收藏:0      [点我收藏+]

标签:order   高度   边框   ima   中国   hit   行高   出现   over   

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之文字溢出处理

标签:order   高度   边框   ima   中国   hit   行高   出现   over   

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

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!