代理加盟

2023全新代理计划,一站式模板建站,铜牌代理低至699元送终身VIP,独立代理后台,自营贴牌。

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

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

来源:本站原创 发布时间:2019-03-30 00:00:00热度:我要评论(0

麦站模板建站平台(10年经验),服务数万家企业,固定透明报价。域名注册、主机/服务器、网站源码一站式服务。实体公司,专业团队,值得选择!超过1000套模板已登记版权,合规合法建站,规避版权风险!【点击获取方案】

       在写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》

    转载请注明来源网址:https://www.xiuzhanwang.com/news/1328.html

    发表评论

    评论列表(条)

       
      QQ在线咨询
      VIP限时特惠