服务报价 | 域名主机 | 网络营销 | 软件工具| [加入收藏]
 热线电话: #
当前位置: 主页 > php教程 > dedecms教程 >

CSS控制单行长度和字符个数的方法 兼容各大浏览器

时间:2017-02-19 10:57来源:未知 作者:最模板编辑 点击:
我们经常遇到dedecms织梦div宽度固定,单行字符有限,文字信息显示不全,影响阅读性和SEO优化,有没有让你抓狂呢? 下面就大家一个CSS控制单行长度和字符个数的方法 兼容各大浏览器
我们经常遇到dedecms织梦div宽度固定,单行字符有限,文字信息显示不全,影响阅读性和SEO优化,有没有让你抓狂呢?
 
下面就大家一个CSS控制单行长度和字符个数的方法 兼容各大浏览器,隐藏多余字符,用“...”代替。
兼容性:
IE6测试兼容,IE7测试兼容,,IE8测试兼容,IE9测试兼容,Chrome测试兼容,FireFox测试兼容,Opera测试兼容。
CSS代码:
.mubanzhijia li{   /* 标签可以定义多个,不过请注意width属性,最好将width属性去掉 */    
    display:block;/*定义为块级;这个属相很重要,没有这个属性,很难实现单行宽度的效果*/    
    width:100%;/*要显示文字的宽度 提醒:可以将此属性剔除,然后就可以多标签的实现单行控制了*/    
    float:left;/*左对齐*/    
    overflow:hidden; /*超出的部分隐藏起来。*/    
    whitewhite-space:nowrap;/*不显示的地方用省略号...代替*/    
    text-overflow:ellipsis;/* 支持 IE */    
    -o-text-overflow: ellipsis; /* 支持 Opera */    
按上面的方法就可解决隐藏多余字符,用“...”代替了。
(责任编辑:最模板)
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
栏目列表
热点内容