• 问题现象

  使用webpack压缩打包vue项目,遇到一个问题,文本多行显示省略号的关键css语句-webkit-box-orient: vertical;莫名其妙丢失失效了。查阅资料,有不少人提出在改样式前后添加注释(后处理程序):

/*! autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */

  再次打包,发现样式恢复正常。然后控制台却多出一条警告:‘(Emitted value instead of an instance of Error) autoprefixer: \static\css\reset\index.css:99:3: Second Autoprefixer control comment was ignored. Autoprefixer applies control comment to whole block, not to next rules.’,这对于强迫症来说是极其难受的。

  • 原因

  正如警告中所说,以上的css处理语句控制的应该是整个css块,而不是在此之后的css。

  • 处理

  将此处修改为:

/*! autoprefixer: ignore next */
-webkit-box-orient: vertical;

  恢复正常。

多行文本省略号样式失效丢失,以及控制台显示autoprefixer警告'Autoprefixer applies control comment to whole block, not to next rules.'的更多相关文章

  1. CSS 多行省略失效 (-webkit-box-orient 失效) Second Autoprefixer control comment was ignored. Autoprefixer applies control comment to whole block, not to next rules.

    webpck不能编译这个属性-webkit-box-orient: vertical https://github.com/fanyifanbumaimeng/Articles/issues/48 / ...

  2. 多行文本省略号的实现.html

    多行文本省略号的实现 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...

  3. CSS 设置多行文本省略号 ...

    CSS 设置多行文本省略号 ... .box{ display: -webkit-box; overflow: hidden; text-overflow: ellipsis; word-wrap: ...

  4. css多行文本省略号问题

    已知,单行文本溢出内容用省略号代替,css代码如下: text-overflow: ellipsis; 溢出部分用...代替 white-space: nowrap; //强制在一行显示 overfl ...

  5. css多行文本省略号(...)

    如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现单行文本省略 <!DOCTYPE html ...

  6. 微信小程序之多行文本省略号

    最近在捣鼓小程序,期间遇到的问题,踩过的坑,也是在网上各种搜.这里也说下我解决的问题,方便大家. 在小程序首页显示文本列表的时候,为了美观,不希望把所有的文本都显示出来,希望是显示前几行(比如前3行, ...

  7. css多行文本省略号

    适用于内核为webkit的浏览器: display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflo ...

  8. [CSS备忘]多行文本省略号

    overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box ...

  9. Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法

    Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法 2014-03-27 11:44:46|  分类: Easy UI|举报|字号 订阅     可以使用$.parser.pa ...

随机推荐

  1. Linux 命令未自动提示补全

    解决方法: yum install -y bash-completion 退出当前界面,重新进入即可.

  2. Spark MLlib之线性回归源代码分析

    1.理论基础 线性回归(Linear Regression)问题属于监督学习(Supervised Learning)范畴,又称分类(Classification)或归纳学习(Inductive Le ...

  3. POJ 3076

    DLX算法,刚接触,是关于精确覆盖的,白书上有算法介绍. 代码模板 #include <iostream> #include <cstdio> #include <cst ...

  4. linux c 操作utmp 和 wtmp 文件接口

    /var/run/utmp 保存当前在本系统中的用户信息 /var/log/wtmp 保存登陆过本系统的用户信息 他们保存的信息是基于结构体 struct utmp 的(/usr/include/bi ...

  5. POJ 3628 Bookshelf 2 题解

    本题解法非常多,由于给出的数据特殊性故此能够使用DFS和BFS,也能够使用01背包DP思想来解. 由于一般大家都使用DFS,这里使用非常少人使用的BFS.缺点是比DFS更加耗内存,只是长处是速度比DF ...

  6. Python中的traceback模块

    traceback模块被用来跟踪异常返回信息. 如下例所示: 1.直接打印异常信息 import traceback try: raise SyntaxError, "traceback t ...

  7. .net core发布到IIS后502.5错误

    net core 在win7系统发布后,出现在502.5错误. 打开“开始”菜单,搜索“事件查看器”,然后选择“事件查看器”应用. 在“事件查看器”中,打开“Windows 日志”节点. 选择“应用程 ...

  8. Oracle数据库学习1------数据库安装及客户端配置

    1.注册Oracle账户: 注册地址:https://login.oracle.com/mysso/signon.jsp 注意:注册的时候尽量使用外国的邮箱,因为使用国内的邮箱可能收不到Oracle发 ...

  9. DDL:对表___table___的相关操作

    1) 增加列 语法: alter table 表名 add 列名 类型(长度) 约束; 2) 修改现有列类型.长度和约束 语法:alter table 表名 modify 列名 类型(长度) 约束; ...

  10. Super超级ERP系统---(10)订单打包

    订单拣货完成后,需要把订单装箱打包,并打印客户地址信息.订单打包的操作流程先是扫描订单号,然后扫描商品条码.  1.订单打包 打印包装箱面单 2.订单发货 订单打包完成后就等待发货,快递公司来拉货的时 ...