指南针变换混合

css CSS

神无

2020-03-27

我有以下CSS：

.progress-bar {
  transform: rotate(0deg) scale(1) skew(-50deg) translate(2px);
  -webkit-transform: rotate(0deg) scale(1) skew(-50deg) translate(2px);
  -moz-transform: rotate(0deg) scale(1) skew(-50deg) translate(2px);
  -o-transform: rotate(0deg) scale(1) skew(-50deg) translate(2px);
  -ms-transform: rotate(0deg) scale(1) skew(-50deg) translate(2px);
}

...并希望通过Compass Transform mixin 进行重构。

文档中没有任何示例，因此我尝试了以下操作：

.progress-bar {
  @include transform (0deg, 1, -50deg, 2px);
}

...并得到此错误：

Syntax error: Mixin transform takes 2 arguments but 4 were passed.

有没有办法用Compass Transform做到这一点？

第3799篇《指南针变换混合》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共2个回答
Stafan 2020.03.27

我认为应该是空格分隔的转换列表，而不是逗号分隔。

.progress-bar {
  @include transform (rotate(0deg) scale(1) skew(-50deg) translate(2px));
}
梅 2020.03.27

您必须指定要使用的变换，以空格分隔。例如：

@include transform(rotate(-135deg) skew(-10deg, -10deg));

相似问题

0 回答

0 回答

5 回答

25 回答

0 回答

0 回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android