zoukankan      html  css  js  c++  java
  • css 超出两行省略号,超出一行省略号

    参考:https://www.cnblogs.com/yangguojin/p/10301981.html

    超出一行省略:

    p{
    
      white-space:nowrap;
    
      overflow:hidden;
    
      text-overflow:ellipsis; 
    
    }

    超出2行省略:

    p {
    
      overflow:hidden; 
    
      text-overflow:ellipsis; 
    
      display: -webkit-box;
    
      -webkit-box-align: start; //让内容居左
    
       /*! autoprefixer: off */
    
      -webkit-box-orient:vertical; 
    
      /* autoprefixer: on */ 
      -webkit-line-clamp:2; 
    
    }

    注:两行注释必须要!因为 webpack打包后-webkit-box-orient会被移除,autoprefixer会自动移除老式过时的代码,所以需要添加注释关闭autoprefixer。如果有清除注释的插件,将该插件设为false,否则不生效。

    但当css样式为外部引入时,这样写会报警告:Second Autoprefixer control comment was ignored. Autoprefixer applies control comment to whole block, not to next rules.
    需修改为:

    /*! autoprefixer: ignore next */
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  • 相关阅读:
    关于centos防火墙
    linux基础命令
    mysql经典语句
    异常处理
    抽象类
    特性-多态
    特性-继承
    特性-封装
    python模块/文件/日期时间
    python函数3-函数嵌套/递归/匿名函数
  • 原文地址:https://www.cnblogs.com/linjiangxian/p/11457445.html
Copyright © 2011-2022 走看看