您现在的位置是:首页 > 教程 > dedecms教程dedecms教程
CSS控制单行长度和字符个数的方法兼容各大浏览器
钱铮友2024-02-04 17:57:23dedecms教程已有人查阅
导读我们经常遇到div宽度固定,单行字符有限,文字信息显示不全,影响阅读性和SEO优化,有没有让你抓狂呢?下面就大家一个CSS控制单行长度和字符个数的方法兼容各大浏览器
我们经常遇到div宽度固定,单行字符有限,文字信息显示不全,影响阅读性和SEO优化,有没有让你抓狂呢?下面就大家一个CSS控制单行长度和字符个数的方法兼容各大浏览器,隐藏多余字符,用“...”代替。
兼容性:
IE6测试兼容,IE7测试兼容,,IE8测试兼容,IE9测试兼容,Chrome测试兼容,FireFox测试兼容,Opera测试兼容。
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 */
}
按上面的方法就可解决隐藏多余字符,用“...”代替了。
本文标签:
很赞哦! ()
下一篇:修改织梦当前位置导航面包屑的方法
相关文章
- pbootcms网站修改CSS样式后自动更新缓存的代码实例
- 两个dedecms分页样式css代码示例
- dede织梦软件列表模板中div css使软件缩略图靠左的修改方法
- dedecms5.6更改默认颜色终极教程附带修改好的CSS表!
- 兼容所有浏览器的CSS3圆角的代码实例
- 常用的十个CSS经典技巧总结
- ecshop模板css高级应用iconfont矢量图替换方法
- ecshop首页调用指定商品分类下商品数量循环和css循环使用说明
- ecshop商城不同分辨率调用不同CSS的方法
- 整理简单的统一CSS命名规则
- ecshop兼容CSS样式在FF、IE7、IE6中的不同表现
- ecshop模板css兼容问题_height:auto火狐下无效的解决方法
随机图文
-
DEDECMS织梦程序安装方法(步骤教程)
很多客户还是不了解织梦程序安装过程,代码号小编在这里给大家提供一下基础的织梦安装教程,大家参考操作即可,很简单的过程,就无需再问了。织梦程序安装前的准备工 -
Dedecms5.6怎么升级到dedecmsv5.7sp1
最近,dedecms安全事故频发,大家应引以为戒,dedecms已经在7月15日更新了紧急安全补丁。如果您的dedecms版本还是非常古老,那么,无忧主机小编强烈建立您 -
织梦dedecms列表文章有缩略图则显示缩略图的实现方法
织梦dedecms列表文章有缩略图则显示缩略图,哪位大侠帮忙给改一下呢!!~ -
织梦dedecms5.7“不添加水印”功能勾选无效怎么办
织梦dedecms5.7“不添加水印”功能勾选无效的解决办法找到include/helpers/image.helper.php这个文件,在里面找到中的
留言与评论 (共有 条评论) |