我正在寻找一种将 mixin 用于特定于浏览器的 CSS hack 的解决方案。我正在使用 JavaScript 在 HTML 类中添加浏览器标记。喜欢.ie .ie7 .ie8 .ie9
我想像这样使用mixin:
.box-test {
margin: 10px;
@include browser(ie7) {
margin: 20px;
}
}
期望的输出:
.box-test {
margin: 10px;
}
.ie7 .box-test {
margin: 20px;
}
我尝试制作的mixin:
@mixin browser($browserVar) {
@if $browserVar == ie7 {
.ie7 { @content }
}
@else if $browserVar == ie8 {
.ie8 { @content; }
}
@else if $browserVar == ie9 {
.ie9 { @content; }
}
}
问题是输出是:
.box-test {
margin: 10px; }
.box-test .ie7 {
margin: 20px; }