[英]Encapsulated/Namespaced CSS and Sass Extend without Nested Selectors
Considering that Sass
' extend feature does not allow for nested selectors. 考虑到
Sass
的扩展功能不允许嵌套选择器。 What is a robust way to write modular and namespaced Sass
while still making use of Sass
' extend feature. 在仍然使用
Sass
的扩展功能的同时,编写模块化和命名空间的Sass
的可靠方法是什么?
Eg I do not wish to pollute my "global" name space with descriptor like class just so I can use Sass
' extend feature. 例如,我不想使用类之类的描述符来污染我的“全局”名称空间,只是为了使用
Sass
的扩展功能。
.button { ... }
.my-widget .large-button { @extend .button; }
Additionally, the following does not work by design: 此外,以下设计不起作用:
.my-widget .large-button { ... }
.your-widget .your-button {
@extend .my-widget .large-button;
}
Sass
' extend feature will not extend nested selectors but it does work within a scope. Sass
的扩展功能不会扩展嵌套选择器,但它确实在作用域内起作用。
Eg 例如
.my-widget {
.button { ... }
.large-button { @extend .button; }
}
Now the descriptor class .button
is not found in the "global" space and is name spaced to .my-widget
. 现在,描述符类
.button
在“全局”空间中找不到,并且名称间隔为.my-widget
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.