全部模板|推荐模板|TAG标签|加入收藏|网站地图您好,欢迎来到模板天下!
您现在的位置:首页 > 建站教程 > Div+Css教程 >

CSS控制字符个数且文字多余隐藏,兼容各大浏览器

时间:2016-07-14 16:20 来源:网络 作者:模板天下 点击:

我们在写html,div+css代码的时候,div的宽度固定,有的标题文字比较长,文字信息显示不全,影响阅读性和SEO优化,那么就要用CSS来控制显示字符个数,隐藏多余字符,用“...”代替。

CSS控制字符个数且文字多余隐藏,兼容各大浏览器

此方法兼容IE6/7/8/7/10/11,Chrome,Firefox,360浏览器等主流浏览器。

CSS代码:

.mbtx li{
    height:25px;/*一定要设置一个固定的高度*/
    line-height:25px; /*行高*/
    overflow:hidden; /*超出的部分隐藏起来。*/
    white-space:nowrap;/*不显示的地方用省略号...代替*/
    text-overflow:ellipsis;/* 支持 IE */
    -o-text-overflow: ellipsis; /* 支持 Opera */
}

按上面的方法就可实现隐藏多余字符,用“...”代替了。

本文版权归原作者所有,转载请注明原文来源出处,模板天下感谢您的支持!

本文链接:http://www.mobantianxia.com/article/20160714169.html CSS控制字符个数且文字多余隐藏,兼容各大浏览器 http://www.mobantianxia.com/article/20160714169.html

您可能也喜欢:
发表评论:

关于本站 - 联系我们 - 售后服务 - 网站公告 - 版权与免责声明 - 留言反馈

© 2016 模板天下(mobantianxian.com) 版权所有,并保留所有权利。 | Powered by DedeCMS | 豫ICP备14009571号-2 |

售前咨询

售后服务

技术支持