zoukankan      html  css  js  c++  java
  • 单行,多行文本省略号

    单行文本省略号
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;

       多行文本省略号

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 3;

    overflow: hidden;

    适用范围:

    因使用了WebKit的CSS扩展属性,该方法适用于WebKit浏览器及移动端;

    注:

    -webkit-line-clamp用来限制在一个块元素显示的文本的行数。 为了实现该效果,它需要组合其他的WebKit属性。常见结合属性:

    display: -webkit-box; 必须结合的属性 ,将对象作为弹性伸缩盒子模型显示 。

    -webkit-box-orient 必须结合的属性 ,设置或检索伸缩盒对象的子元素的排列方式

  • 相关阅读:
    fidller 打断点
    随笔
    HTML标签介绍
    补充9.27----9.28
    html5_______9.26
    9.14
    9.13笔记
    9.12笔记
    CSS样式的引用
    html5_______9.10
  • 原文地址:https://www.cnblogs.com/LHH1314/p/7783988.html
Copyright © 2011-2022 走看看