Css 在less中嵌套样式、父样式和子样式
如何为元素及其某些后代设置样式?例如:Css 在less中嵌套样式、父样式和子样式,css,less,Css,Less,如何为元素及其某些后代设置样式?例如: .datepick-month-header, .datepick-month-header select, .datepick-month-header input { background-color: black; color: #fff; font-weight: bold; } 在较少的文档中,我发现嵌套样式工作得很好,但我希望同时选择$this和子体 .datepick-month-header { select, input {
.datepick-month-header, .datepick-month-header select, .datepick-month-header input {
background-color: black;
color: #fff;
font-weight: bold;
}
在较少的文档中,我发现嵌套样式工作得很好,但我希望同时选择$this和子体
.datepick-month-header {
select, input { // this selects "select" and "input",
}
}
如何在一个声明中设置所有三个元素(父元素、子元素)
谢谢使用&引用父上下文,例如
.a {
&, & .b .{
}
}
我知道我可以这样做,但在输出css中获得冗余代码:
.datepick-month-style {
background-color: @datepickMonthHeaderBackgroundColor;
color: @datepickMonthHeaderColor;
font-weight: bold;
}
.datepick-month-header {
.datepick-month-style;
select, input {
.datepick-month-style;
}
}
你试过你的建议了吗?简单地声明多个用逗号分隔的选择器就可以了。你有什么问题?当然,我明白了:.datepick month header select,.datepick month header input{background color:#000000;color:#FFFFFFFF;font-weight:bold;}它不符合父项的样式,应该可以正常工作。我刚刚在对less编译器运行了相同的代码,得到了预期的结果。@JamieDixon我还想设置datepick month头的样式,但不知道如何声明它,比如:$this,select,输入。我知道这是如何解决您的问题的@Daniele,但我仍然不太明白为什么简单的连锁减容对您不起作用。如果我做.a、.a.b{},这对我来说很好。我不知道我是否理解错了你的问题,或者你有什么不对劲。我知道有几十种方法可以做到这一点,但我是为了知识而问的;)