溢出问题

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 的内容

你可能感兴趣的:(溢出问题)