Css dotLess-使用以标记名开头的选择器进行混合
我用的是这样的“混音”:Css dotLess-使用以标记名开头的选择器进行混合,css,dotless,Css,Dotless,我用的是这样的“混音”: .base-button-style { ... } .specific-button-style { .base-button-style; //mixin ... } 这个很好用。但现在我需要更改基本样式的选择器,通过添加标记名为其提供更高的优先级: input.base-button-style { ... } 但是,dotLess似乎不喜欢这样,因此.less文件根本无法“解析”。我尝试将其更改为此,但没有更好的结果: i
.base-button-style
{
...
}
.specific-button-style
{
.base-button-style; //mixin
...
}
这个很好用。但现在我需要更改基本样式的选择器,通过添加标记名为其提供更高的优先级:
input.base-button-style
{
...
}
但是,dotLess似乎不喜欢这样,因此.less文件根本无法“解析”。我尝试将其更改为此,但没有更好的结果:
input.base-button-style
{
...
}
.specific-button-style
{
input.base-button-style;
...
}
(也就是说,标记名在基本样式和用作mixin的位置都具有。)
有没有办法让这一切顺利进行?
请注意,我在HTML中同时使用基本按钮样式和特定按钮样式。我不确定mixin是否可以有选择器,因为它们实际上是从最终代码中剥离出来的函数 最好将您的
特定按钮样式
嵌套在基本按钮样式
下,如下所示:
.base-button-style
{
...
}
.specific-button-style
{
.base-button-style; //mixin
...
}
。按钮{
显示:内联块;
大纲:无;
光标:指针;
文本对齐:居中;
文字装饰:无;
填充物:5em 2em.55em;
文本阴影:0 1px 1px rgba(0,0,0,2);
.边界半径(.5em);
.box阴影(0,1px,2px,rgba(0,0,0,2));
字体大小:粗体;
字体大小:15px;
@按钮颜色:#faa51a;
&.edit和.orange{
.按钮正常(@按钮颜色);
&:访问{.button normal(@button color);}
&:hover{.button hover(@button color);}
&:active{.button active(@button color);}
}
}
.edit
和.orange
类的&:运算符有效地生成.button.edit
和.button.orange
类。因此HTML元素具有class='button edit'
。这在IE7+和所有其他常见的解决方案上都会起作用。我使用了另一种解决方案,而不是您的解决方案,但感谢您提供有关&-运算符的提示!似乎你是对的,你混入的类除了类名之外不能有其他选择。你最终使用了什么解决方案?