zoukankan      html  css  js  c++  java
  • 文字超出隐藏

    (1).文字超出一行,省略超出部分,显示’…’ 
    如果这种情况比较多,可以取一个切合作用的类名用于复用。

    .line-limit-length {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; //文本不换行,这样超出一行的部分被截取,显示...
    }
    <div class="item">
        <p class="line-limit-length">最新消息:神秘地球黑洞深不可测,不停吸入周围海水。</p>
        <i class="icon icon-arrow-Go"></i> //图标字体
    </div>
    

    (2). 可以给定容器宽度限制,超出部分省略

    .product-buyer-name {
    max- 110px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    }
    

    3、html文字超过两行或三行就显示省略号

    .p1{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    }
    

      转载自https://blog.csdn.net/liwenfei123/article/details/69666880

  • 相关阅读:
    最短路问题之Dijkstra算法
    最短路问题之Bellman-ford算法
    最小生成树之Kruskal(克鲁斯卡尔)算法
    二分图问题
    七桥问题与欧拉道路
    拓扑排序
    八连通块
    四连通检测
    USACO19DEC题解
    1206 雅礼集训D2题解
  • 原文地址:https://www.cnblogs.com/chenlw/p/9327337.html
Copyright © 2011-2022 走看看