嵌套的 css 规则
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3720844/
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
nested css rules
提问by M4N
Some time ago I saw an example of a css file, where the css rules/selectors where specified in a nested way, e.g. something like this:
前段时间我看到了一个 css 文件的例子,其中 css 规则/选择器以嵌套方式指定,例如这样的:
div.a {
color: red;
div.b {
font-weight: bold;
}
}
I'm not sure where I saw that (probably in a SO question), or whether it was exactly as shown above.
我不确定我在哪里看到的(可能是在一个 SO 问题中),或者它是否完全如上所示。
My questions: Is the above CSS correct/valid? Is it a standard way to specify CSS rules or is this a browser-dependent hack?
我的问题:上述 CSS 是否正确/有效?这是指定 CSS 规则的标准方法还是依赖于浏览器的 hack?
回答by BoltClock
That is not valid standard CSS, but it's an example of nesting class declarations using Sass/SCSSor LESSand I believe other CSS extensions out there, which expand it to something like this (which is valid CSS), before serving it to the browser to use:
这不是有效的标准 CSS,但它是使用Sass/SCSS或LESS嵌套类声明的一个例子,我相信其他 CSS 扩展在那里,在将它提供给浏览器之前将它扩展为这样的东西(这是有效的 CSS)使用:
div.a {
color: red;
}
div.a div.b {
/* Inherits color from div.a */
font-weight: bold;
}
回答by HoLyVieR
回答by meder omuraliev
You can nest rules with SASS, http://sass-lang.com/
你可以用 SASS 嵌套规则,http://sass-lang.com/
Maybe that was it?
也许就是这样?
回答by balupton
Seems there is a proposal over at https://tabatkins.github.io/specs/css-nesting/
似乎有一个提案在https://tabatkins.github.io/specs/css-nesting/
but I can't find the status of it
但我找不到它的状态