[前端]vue中打包后-webkit-box-orient: vertical消失(超出省略号失效)

之前写代码的时候遇到一个问题,就是用了下面这段css代码来让文字超出范围隐藏并显示省略号。

    overflow:hidden;/*超出隐藏*/
    text-overflow:ellipsis;/*文本溢出时显示省略标记*/
    display:-webkit-box;/*设置弹性盒模型*/
    -webkit-line-clamp:1;/*文本占的行数,如果要设置2行加...则设置为2*/
    -webkit-box-orient: vertical;

然鹅本地运行的时候是没有问题的,但是build之后发现失效了。仔细一看是 -webkit-box-orient: vertical; 没有起效。
最后各种修改之后发现应该是webpack的锅
解决方案是改成下面这样

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

记得要带上感叹号

参考:https://github.com/postcss/autoprefixer/issues/776

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • H5移动端知识点总结 阅读目录 移动开发基本知识点 calc基本用法 box-sizing的理解及使用 理解dis...
    Mx勇阅读 10,127评论 0 26
  • 移动开发基本知识点 一.使用rem作为单位 html { font-size: 100px; } @media(m...
    横冲直撞666阅读 8,895评论 0 6
  • 一早又是自然醒来,5:33!失眠了几个小时还是自动醒来了!这生物钟比闹钟还灵啊! 清除掉凌晨设置的...
    婉叶老师阅读 4,039评论 2 7
  • 车窗外 有郁郁葱葱的树 绿色的稻田 零零散散的房子 快要脱落的旧瓦片 在远处 有朦朦胧胧的山 稀疏的云 成群结队的...
    啊澈儿阅读 1,482评论 0 4
  • 想做手账目的是觉得自己最近生活的状态越来越丧,对很多事情提不起兴趣。 阅读、电影、运动......这些曾经让我觉得...
    知更鸟与海阅读 2,701评论 0 0