css文字与省略号重叠,CSS 文字溢出处添加省略号(示例代码)

兼容火狐、Opera、chrome的文字溢出添加省略号的功能，好像以前分享过几款代码了，

但是之前的没考虑过各个浏览器的兼容性问题，现在这款对各大浏览器的兼容都表现不错，

当文字或字符超出外层Div的时候，自动隐藏并添加省略号，对前端开发来说，这是个相当不错的CSS特效吧。

文字溢出添加省略号

.textoverflow a {

display: block;

width: 120px;

margin: 0px 0px 0px 3px;

white-space: nowrap;

overflow: hidden;

float: left;

-o-text-overflow: ellipsis; /* for Opera */

text-overflow: ellipsis; /* for IE */

}

.textoverflow:after {

content: "…";

}

/* for Firefox */

@media all and (min-width: 0px) {

.textoverflow:after {

content: "";

}

/* for Opera */

}

绿油油的大白猪，在湛蓝的草坪上吃草