是否有合并类声明的(纯)CSS运算符?
问题描述:
当我做我的CSS文件,我有这样的:是否有合并类声明的(纯)CSS运算符?
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
button{
padding:10px
border-radius:10px;
}
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
button,
.shadow{
box-shadow: ....
}
我可以以某种方式合并纯CSS这两个声明,所以我会,相反,有这样的事情:
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
button{
padding:10px
border-radius:10px;
}
+ // some operator that would join the next class declaration on the previous declaration
.shadow{
box-shadow: ....
}
标题上的“纯”,我的意思是没有LESS或SASS可以做到这一点吗?
答
没有LESS或SASS或SCSS,这是不可能的。
有了SCSS,你可以尝试这样的事情。
SCSS
.shadow{
box-shadow:1px 1px 1px solid red;
}
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
button{
padding:10px;
border-radius:10px;
@extend .shadow;
}
希望这有助于..
答
没有,但如果你只是写这...
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
button{
padding:10px
border-radius:10px;
}
.shadow{
box-shadow: ....
}
...定义的box-shadow会被添加到具有shadow
类的相应输入元素,并且保持其所有其他属性。
没有,但如果你使用CSS预处理器,这个功能是相当微不足道的:) – Terry
还没有,但有一个规范草案旨在支持这个,[这里](https ://tabatkins.github.io/specs/css-nesting/)。 – glhrmv