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

溢出问题

时间:2015-11-05 15:04:32      阅读:201      评论:0      收藏:0      [点我收藏+]

标签:

1、单行文本溢出显示省略号

html代码:
<div>
<p><span>CSS Web Design 我爱CSS-Web标准化 Div+css教程 - www.52css.com</span><p>
</div>

css代码:
div{
width:200px;/*容器的基本定义*/
height:200px;

}

/* IE下的样式 */ 
p span{
display: block;
width:200px; /*对宽度的定义,根据情况修改*/
overflow: hidden; /* 溢出内容隐藏 */
white-space: nowrap;/* 强制内容在一行显示 */
text-overflow: ellipsis;/* 文本溢出时显示省略号 */

}

/* FF 下的样式 */ 
p{clear:both;}
p span{
float:left;
max-width:175px;   /*IE不能解释该属性,而FF可以*/
}
p:after{
content:"...";
}

 

以上代码来自:http://www.cnblogs.com/xiaochaohuashengmi/archive/2010/08/06/1793922.html

 

text-overflow:clip | ellipsis

clip:不显示省略号标记,ellipsis显示省略号标记。

2、多行显示省略号标记

可参考 http://www.css88.com/archives/5206 的内容

溢出问题

标签:

原文地址:http://www.cnblogs.com/slp-qm/p/4939341.html

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