CSS 单行溢出文本显示省略号...的方法(兼容IE FF)(转)

【方法】:设置css样式

overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
设置宽度属性
对于span需要设置display:block

 

【代码】:

.jgwddown {
    width: 385px;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

详见 http://www.cnblogs.com/hlz789456123/archive/2009/02/18/1392972.html

 

 

【学习】

【overflow:hidden】 作用

http://blog.sina.com.cn/s/blog_60b35e830100uw3z.html

【display: block】 作用

(1)http://zhidao.baidu.com/link?url=EGWhdrwAtNqo5uPDIz5k4c4RIeKeL4cFhhNlKL_9SStgHPzxjXpTCL6fXb1hU_fRk7s8oZKkwdJDtnLipnVd6q

(2)http://www.cnblogs.com/luckboy/archive/2010/04/15/1712365.html

 【white-space: nowrap】作用

http://www.w3school.com.cn/cssref/pr_text_white-space.asp

【text-overflow: ellipsis】作用

http://www.mb5u.com/divcssjiaocheng/14015.html 

还必须定义:强制文本在一行内显示(white-space:nowrap)及溢出内容为隐藏(overflow:hidden)。

 

 -===============================================

换行 css  设置a或span换行

span a{

background:red;
width:166px;
white-space:pre-line;
word-break:break-all;
display:block;

}

你可能感兴趣的:(CSS 单行溢出文本显示省略号...的方法(兼容IE FF)(转))