问题标签 [less-mixins]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
89 浏览

less - 具有多个参数的混合 - 如何选择属性?

我正在阅读有关 LESS的手册,这里有以下示例:

It is legal to define multiple mixins with the same name and number of parameters. Less will use properties of all that can apply. If you used the mixin with one parameter e.g. .mixin(green);, then properties of all mixins with exactly one mandatory parameter will be used:

compiles into:

我似乎无法掌握选择属性背后的逻辑。有人可以解释一下吗?

0 投票
1 回答
147 浏览

css - 通过 less 生成 CSS 组

是否能够创建这样一个生成 CSS 组的 mixin?我将在下面解释我的意思:

它会产生类似的东西:

0 投票
1 回答
238 浏览

css - 无法扩展 Less mixin

我想使用 Less 获得以下 CSS 输出

到目前为止,我已经想到了 Less 语法,但它不起作用。

我无法应用任何extend逻辑来生成此语法。我可能遗漏了一些东西,或者我不知道如何在 Less 中正确地做到这一点。另外,我不希望.selected-dropdown-valuesmixin 在 CSS 中输出。

0 投票
1 回答
295 浏览

less - 更少的 mixin 和变量

我有以下混合:

如果我只想改变第二个变量的值,我需要写第一个变量的默认值吗?

0 投票
1 回答
70 浏览

less - 在 LESS 中创建带有参数的 mixin

我想创建一个 mixin,这样我就不必总是输入相同的代码。我希望 mixin 接受参数。这是我必须一次又一次地写的部分(.serial 和 .circle 部分):

我想创建这样的东西:

这有可能吗?

0 投票
1 回答
322 浏览

css - 在 Less 选择器中使用函数/mixin

我需要重复我的选择器。Less CSS 中有什么方法可以用函数/mixin 来做到这一点吗?

注意:框架内容不同。

0 投票
1 回答
146 浏览

css - 将只接受 from & 的 mixin 转换为关键帧选择器以接受多个关键帧选择器

我有这个少混合:

我打电话例如:

结果是:

但是我怎样才能使用 Less mixins,这样我就可以使用不同于 0%、100% 和超过 2 个关键帧选择器的关键帧选择器,所以结果将如下所示:

感谢帮助。

0 投票
2 回答
1442 浏览

html - 如何将多个类名传递给LESS中的mixin

我正在制作一个显示帐户交易的视图,并且我想对交易类型/状态进行颜色编码。我还想展示一个解释颜色代码的图例。

我想要一个结构如下的最终结果:

HTML

CSS

(代码笔)

请注意,“借方”使用两个类别名称,以将它们与贷方区分开来。

显然那里有一些冗余,我试图将其重构为这个(无效的)LESS 代码:

一种可能的解决方法是重新调整事物,以便不同的事务类型具有一个唯一的类名称,但这感觉就像时间旅行到 IE6 时代。即我知道,但想避免这个有效的 LESS,它看起来如此接近,但到目前为止:

我尝试引用类名,但即使这使第一个 LESS 示例编译,引号也会传递给输出 CSS。那么,有没有办法将“标识符”以外的东西作为参数传递给LESS mixin,并让它在选择器插值中正确工作?

0 投票
3 回答
199 浏览

css - Less mixin 和 CSS 选择器之间的名称冲突

我有这个简化的 Less 脚本

当我通过本地编译器或winless online less 编译器运行它时的输出是

安装所需的输出

这是一个错误还是我在这里遗漏了什么?

结果,在我看来,我不能拥有与具有默认值的 mixins 同名的 CSS 选择器。

我在使用我的站点特定代码编译 Bootstrap 时遇到了这个问题。在这种特殊情况下,我可以解决它,但是随着项目的增长并且我包含其他我无法成像的项目,我必须跟踪任何具有默认值的 mixin?

编辑:我现在看到我应该阅读手册并且在文档的第一页上几乎可以看到所有东西都可以被视为混合。

0 投票
1 回答
958 浏览

css - Less Mixins:边界智能混合

我为边框速记属性创建了单独的 mixin,为不同的边创建了另一个 mixin。

速记

用法

针对不同的面

用法

有没有办法在一个 mixin 中连接这些可能性?