twitter-bootstrap 如何正确覆盖 box-shadow bootstrap mixin？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13290135/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to properly override a box-shadow bootstrap mixin?
提问by Wallace Sidhrée
This is the code:
这是代码：
<ul>
<li></li>
<li></li>
<ul>
<li></li>
<li></li>
</ul>
</ul>
And this is the LESS style:
这是 LESS 风格：
ul li { .box-shadow(0 1px 3px rgba(0,0,0,.25)); }
I want to override/cancel the mixin on the sub-list, so I tried this:
我想覆盖/取消子列表上的mixin，所以我尝试了这个：
ul ul li { .box-shadow(none); }
...but it didn't work. The only way I got it to work was by explicitly overriding each line on the mixin:
......但它没有用。我让它工作的唯一方法是明确覆盖mixin上的每一行：
ul ul li {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
So wha'ts wrong withul ul li { .box-shadow(none); }?
那么有ul ul li { .box-shadow(none); }什么问题呢？
回答by Wallace Sidhrée
Too bad I didn't check the bad output when it broke the whole compilation, but
太糟糕了，当它破坏整个编译时我没有检查错误的输出，但是
ul ul li { .box-shadow(none); }
ul ul li { .box-shadow(none); }
...is working just fine. :P
...工作正常。:P
回答by Fa11enAngel
If you use twitter bootstrap with SCSS/SASS, I would use the builtin mixins, which handels browser specific flags:
如果你使用带有 SCSS/SASS 的 twitter bootstrap，我会使用内置的 mixins，它处理浏览器特定的标志：
ul ul li { @include box-shadow(none); }
