在 scss 中添加全局父选择器答案

【问题标题】：Adding a global parent selector in scss在 scss 中添加全局父选择器
【发布时间】：2023-03-16 18:46:01
【问题描述】：

我正在使用具有良好 scss 结构的 Foundation 6。但是如何为其输出 css 添加全局父选择器？

我需要为一个奇怪的站点执行此操作以避免 css 被覆盖（我将首先进行 css 重置）。目前我必须手动在输出 css 上进行嵌套并再次渲染以使其工作，

.this-site-only {
    %final css output%
}

我想我可以使用 Gulp 或 WebPack 实现相同的结果，但我也很想知道是否有任何 SCSS/SASS 方法可以做到这一点？

【问题讨论】：

标签： css sass

【解决方案1】：

如果我正确理解了您的问题。您可以简单地将导入内容包装到主 SCSS 文件中所需的选择器中（在我的情况下为 app.scss）。然后你就会有这样的东西：

.this-site-only{ 
    @import 'foundation';
    @import 'your-stuff';

    .your-style{
        color: #000;
        font-size: 20px;
    }
}

【讨论】：