webpack3不支持-webkit-box-orient:vertical

最新推荐文章于 2024-04-03 09:10:23 发布
最新推荐文章于 2024-04-03 09:10:23 发布
阅读量1.3k 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_34486420/article/details/79963332
版权

问题：

css3样式超出两行隐藏


在webpack3不起效果，-webkit-box-orient:vertical不会被编译

解决办法：


原因：

autoprefixer不仅会帮你加-webkit-之类的prefixer，还会删除css中的样式，用注释包裹就不会被删除


lin_dan_ht
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
webpck不能编译这个属性-webkit-box-orient: vertical
jackie_bobo的博客
08-14 879
多出指定行后，用省略号…代替。 -webkit-line-clamp 是一个 不规范的属性（unsupported WebKit property），它没有出现在 CSS 规范草案中。 限制在一个块元素显示的文本的行数。 为了实现该效果，它需要组合其他外来的WebKit属性。常见结合属性： - display: -webkit-box：必须结合的属性 ，将对象作为弹性伸缩盒子模型...
webpack-upload-plugin:Webpack插件
05-13
环境要求节点> = 10.5.0安装npm i -D webpack-upload-plugin注意该插件不提供上传至CDN的服务。 实际上，它实际上取决于这种服务。 此插件适用于Webpack> = 3。 对于webpack @ 4，将optimization.minimize设置为...
vue项目中关于CSS样式【-webkit-box-orient: vertical】打包后丢失问题
qq_25335529的博客
05-10 3507
        最近在做vue项目的时候页面处理多行文本样式时用到了-webkit-box-orient: vertical这个属性，本地跑项目没问题，但是打包放到服务器后发现这个属性丢失了。如下图：.topic-info { margin: 5px 10px; font-size: .8em; text-indent: 2em; d...
webpck -webkit-box-orient: vertical
weixin_39168678的博客
11-21 317
/*! autoprefixer: off */ -webkit-box-orient: vertical; /* autoprefixer: on */ 信大哥的，没错
解决webpack打包后-webkit-box-orient: vertical ;消失问题
weixin_30598225的博客
11-26 155
在前段展示中，一个很常见的问题 就是多行文本溢出显示“...”,再是对兼容性要求不算太高的时候 使用box布局是一种非常实用的方法 .ellipsis-2{ overflow hidden text-overflow ellipsis display -webkit-box -webkit-line-clamp 2 -webkit-box-orient vert...
CSS3.0盒模型display:-webkit-box;的使用
我以我名，行我道！
03-14 1568
box-flex是css3新添加的盒子模型属性，它的出现可以解决我们通过N多结构、css实现的布局方式。经典 的一个布局应用就是布局的垂直等高、水平均分、按比例划分。 目前box-flex属性还没有得到firefox、Opera、chrome浏览器的完全支持，但可以使用它们的私有属性定义firefox(- moz)、opera(-0)、chrome/safari（-w
webpack-使用webpack-dev-server.rar
04-12
热模块替换是 `webpack-dev-server` 的一项高级特性，它允许在不刷新整个页面的情况下更新模块。这意味着你可以修改组件或样式，并立即看到变化，保持应用程序的状态。它通过在模块被替换时注入更新来实现这一点，...
webpack-dev-middleware：用于webpack的开发中间件
02-06
webpack-dev-中间件 与捆绑包一起使用的快速开发中间件，可用于服务从Webpack发出的文件。 这应该仅用于开发。 使用此中间件的一些好处包括： 没有文件写入磁盘，而是处理内存中的文件 如果文件以监视模式更改，则...
webpack4-cdn-plugin:上传 webpack 资源到 cdn，允许重命名散列资源
05-31
此插件仅支持webpack@4 。 Webpack配置 process.env.NODE_ENV OR options.mode ：此插件仅适用于生产模式。 output.publicPath ：我们只支持/或空字符串（为简单起见）。 optimization.minimize : 如果您的 CDN ...
web-webpack-plugin：替代html-webpack-plugin
02-03
web-webpack-plugin 想全面学习Webpack？试试它： 不错替代品，可以使webpack将HTML用作条目并处理多页。 安装 npm i web-webpack-plugin --save-dev const { WebPlugin , AutoWebPlugin } = require ( 'web-...
uniapp view组件中的 -webkit-box-orient 属性
最新发布
活到老学到老
04-03 1357
在上面的示例中，view组件的class为container的元素具有flex布局，并且通过设置-webkit-box-orient属性为vertical，实现了子元素的垂直排列效果。在uni-app中，推荐使用flex-direction属性来控制子元素的排列方向，而不是直接使用-webkit-box-orient属性。在uni-app中，view组件使用了flex布局，可以通过设置-webkit-box-orient属性来控制子元素的排列方向。
CSS -webkit-box-orient: vertical 属性编译后丢失问题详解
热门推荐
weixin_41544124的博客
06-17 2万+
最近在写项目的时候遇到一个问题，需求是标题只显示2行，超出显示... 代码如下 overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidd...
解决CSS中-webkit-box-orient: vertical属性编译后丢失问题
weixin_49523082的博客
06-12 663
解决CSS中-webkit-box-orient: vertical属性编译后丢失问题
VUE -webkit-box-orient: vertical打包放到线上不显示
niesiyuan000的博客
02-09 5038
先说明问题是什么，出现的状况是 -webkit-box-orient: vertical这个属性在本地运行是存在的，但是打包后放到线上这个属性消失了； 问题出现原因：打包时这个属性和注释混在了一起（个人猜测） 解决办法：下面每种都可解决，根据个人需求随意挑选 1.直接在行内加 -webkit-box-orient: vertical（虽然管用但是我的项目需要添加的这个太多了，所以我选择...
webpack3不编译-webkit-box-orient: vertical;的问题的解决办法
u010289890的博客
09-12 2347
需求：通过-webkit-box-orient: vertical;实现div中的内容显示两行，并在结尾加省略号 css样式： webpack编译结果： 解决方式1： autoprefixer不仅会帮你加-webkit-之类的prefixer，还会删除css中的样式，用注释包裹就不会被删除；注意：autoprefixer:on和autoprefixer:off必须用/* */包...
vue项目打包后样式-webkit-box-orient: vertical丢失
DreamFJ的博客
03-01 472
vue项目打包后样式-webkit-box-orient: vertical居然神奇的消失了，好像跟optimize-css-assets-webpack-plugin这个插件有关，解决办法：https://github.com/postcss/autoprefixer/issues/776 1.css 2.scss要加"!" ...
vue项目中关于CSS样式-webkit-box-orient: vertical丢失问题
m0_57484291的博客
03-01 1235
-webkit-box-orient: vertical丢失
如何解决CSS中-webkit-box-orient: vertical属性编译后丢失问题
Anony_me的博客
06-15 3372
一、起因需求要求展示两行，多余的文字用三个点替代，于是用了这几个不太规范的属性 后来发现代码里写的好好的，一到页面上居然没有反应，和没写一个样，f12看了下，原来是这个属性丢失，导致了不生效，在Styles里把这个属性加上就好了，于是断定是编译过程导致这个属性丢失。二、解决办法网上找了一个可行的解决方案，把autoprefixer关掉，有一种写法： 这样确实解决了编译丢失的情况，但会在编译过程中报warning，最后到GitHub上找到最佳解决方案,如下 问题解决，也不报warning了。...
[ -webkit-box-orient: vertical ] 打包后丢失问题
江木
11-06 757
最近在做vue项目的时候页面处理多行文本样式时用到了-webkit-box-orient: vertical这个属性，本地跑项目没问题，但是打包放到服务器后发现这个属性丢失了。   1. 加上这注释命令 /*! autoprefixer: off */ -webkit-box-orient: vertical; /* autoprefixer: on */ 2. optimiz...
sh1:webpack-dev-server: Permission denied
09-08
"sh1:webpack-dev-server: Permission denied"是一个错误信息，它表示在运行webpack-dev-server命令时没有权限。这个错误通常是由于缺少执行该命令的权限所引起的。 要解决这个问题，你可以尝试以下几种方法： 1. ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值