global(冒号global)做什么？
global(冒号global)做什么？
提问于 2017-04-25 22:32:50
在一些SCSS文件中，我看到了以下内容：
:global {
/* ... */
}我不知道它是SCSS特性还是CSS特性。我试着搜索它，但没有找到任何好的第一眼结果。
回答 2
Stack Overflow用户
发布于 2018-10-19 23:11:23
模块化CSS使用CSS模块编译器在其各自的模块(例如，React组件)内限定CSS样式的范围。
下面是一个React模块的示例(在ErrorMessaging.jsx React组件的ErrorMessaging.less文件中)：
:global(.ocssContainer) {
.ui_column {
padding-left: 0;
}
}它被编译成：
.ErrorMessaging__alertContainer--1I-Cz .ocssContainer .ErrorMessaging__ui_column--3uMUS {
padding-left: 0;
}但是现在我在.ui_column上添加了一个:global修饰符
:global(.ocssContainer) {
:global(.ui_column) {
padding-left: 0;
}
}这就是它编译成的结果：
.ErrorMessaging__alertContainer--1I-Cz .ocssContainer .ui_column {
padding-left: 0;
}现在，.ui_column可以应用于具有该样式的任何子元素，包括子React组件中，而不仅仅是属于ErrorMessaging React组件的.ui_column元素。
Stack Overflow用户
发布于 2017-04-25 23:24:16
看起来他们正在使用CSS Modules。如果你遵循文档，他们会说：
：全局切换到当前选择器的全局作用域。标识符。：全局(.xxx)分别@keyframe : global (xxx)在全局作用域中声明括号中的内容。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43613619
复制相关文章
相似问题
腾讯云开发者
