zoukankan      html  css  js  c++  java
  • CSS 实现文本超出容器范围用省略号显示(单行+多行)

    一、单行省略号

    实现代码:

    <div class="text-container">AAAAAAAAAAAAAAAAAAAAAAAAA</div>
    
    .text-container {
       100px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    

    二、多行省略号

    实现代码:

    <div class="text-container">AAAAAAAAAAAAAAAAAAAAAAAAA</div>
    
    .text-container {
       100px;
      word-break: break-all;
      text-overflow: ellipsis;
      overflow: hidden;
      display: -webkit-box;
      -webkit-line-clamp: 2; /* 设置最多显示几行 */
      -webkit-box-orient: vertical;
    }
    
  • 相关阅读:
    java线程上
    java常用类
    java面向对象4
    java 面向对象三
    java面向对象下
    java面向对象
    java基础下
    Java之Stream流
    JAVA泛型
    英语
  • 原文地址:https://www.cnblogs.com/Leophen/p/13746851.html
Copyright © 2011-2022 走看看