代理加盟 2019全新代理计划 赚钱+省钱双管齐下,独立平台,丰厚利润!

您现在的位置: 秀站网 > 站长学院 > 建站教程 >

CSS3超过宽度显示省略号...

来源:未知 发布时间:2019-03-30热度:我要评论
在写WEB前端代码时,有些CMS会能按照意愿控制字数多少,在自适应页面设置的时候就方便了,使用CSS样式 p.title{ width:200px; height:60px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} 第三句是文字超过了规定的宽度高度则隐藏,虽然对搜索引擎没...

       在写WEB前端代码时,有些CMS会能按照意愿控制字数多少,在自适应页面设置的时候就方便了,使用CSS样式

p.title{
 width:200px;
 height:60px;
 overflow:hidden;
 white-space:nowrap;
 text-overflow:ellipsis;
}

       第三句是文字超过了规定的宽度高度则隐藏,虽然对搜索引擎没什么影响,但对用户不友好,造成阅读障碍,影响点击。

       第四句text-overflow属性,规定当文本溢出包含元素时发生的事情。有三个属性

clip 修剪文本
ellipsis 显示省略符号来代表被修剪的文本
string 使用给定的字符串来代表被修剪的文本

       上面案例会在超过限制宽度后显示省略号“...”,这个属性属于CSS3,主流浏览器都支持。IE低版本的就不支持了,如果想IE6/IE7/IE8支持CSS3,参考文章《IE6/IE7/IE8浏览器支持CSS3》

本文地址:http://www.xiuzhanwang.com/news/1328.html

    责任编辑:秀站网

    发表评论

    评论列表(条)