【发布时间】：2014-10-05 12:47:05
【问题描述】：
按预期使用 Zurb 基金会提供的工具意味着您必须破坏您的 HTML 标记。您将添加 HTML 不需要的类，而不仅仅是为了引入该 Foundation 功能。
使用 SASS 源代码，我试图通过使用 @extend 来避免上述问题。
我想避免的一些示例 HTML 标记
<nav id="main_navigation" class="top-bar">
这样做
#main_navigation {
@extend .top-bar;
}
我意识到这仍然会编译成多余的 CSS，并且可能会破坏顶栏的 JS 功能，但让我们把它留到另一个问题。
问题是它不起作用！适用于.top-bar 的子类以及任何伪类的样式不会扩展到适用于#main_navigation。我试过recreate the problem in a CodePen，但是那里编译的代码是完美的。
那么这是 Foundation 中的结构性问题吗？还是我搞砸了？
我使用带有 grunt-sass 的 Grunt 任务来编译 Foundation SASS，然后使用我自己的代码。
【问题讨论】：
-
“不起作用”不能解释问题。是否有错误（它是什么？）？如果选择器不可扩展，Sass 要么抛出错误，要么扩展选择器。
-
@cimmanon 适用于 .top-bar 的子级以及任何伪类的样式不会扩展到适用于 #main_navigation。 （引用下面的实际句子）
标签： css sass zurb-foundation compass-sass