使用内容：“”；在 SASS 中（不是 scss）答案

【问题标题】：Using content: " "; in SASS (not scss)使用内容：“”；在 SASS 中（不是 scss）
【发布时间】：2016-09-14 19:53:15
【问题描述】：

对于有经验的 SASS 编码人员来说，这一定是一个非常简单的问题，我开始使用它而不是使用 SCSS，我只想知道如何使用“空白”内容元素制作伪元素，以使它们工作（出现在 DOM 上）我会用scss写：

#element {
    &:before {
        content:'';
    }
}

这是我想在 SASS 中完成的，如果我这样写它不会编译：

#element
    &:before
        content:''

它似乎期待内容的价值，我用它来制作装饰性伪元素，如边框、线条或具有另一个背景的元素，很多东西，如：

#element {
    &:before {
        content:'';
        top: 0;
        left: 0;
        width: 100px;
        height: 100px;
        background-color: black;
    }
}

这只是一个例子，我知道 css 和 scss 的语法，但对于 sass 就无法编译。

【问题讨论】：

是否改变了你的 Sass 的格式，或者你写的时候没有换行？
当你说“它只是无法编译”时，究竟是什么问题？

标签： html css compiler-errors sass

【解决方案1】：

在您的示例中，content: 和引号之间没有空格。我得到一个没有空格的错误（SASS 需要一个伪类或伪元素），但可以很好地使用空格：

#element
  &:before 
    content: ''

【讨论】：

很好，我可以重现这个。假设 OP 使用换行符，这是正确的答案

【解决方案2】：

element
  &:before
    content: ""

和

element2
  &:before
    content: ''

和

element3:before
  content: ""

和

element4:before
  content: ''

似乎在 SassMeister 支持的所有 Sass 编译器（LibSass 3.3.6、Sass 4.0.0.alpha.1、Sass 3.4.21、Sass 3.3.14）中都可以正常工作。这是一个工作要点：http://www.sassmeister.com/gist/0249fb7d41b10250bbcbcf336ef3d4f5（更改选项菜单下的编译器；注意 libsass 注释是由 SassMeister 添加的，我似乎无法删除它）

【讨论】：

你好，我是用gulp-sass编译的，会是这个问题吗？
好的，我测试了gulp-sass，它对我有用。你没有说你是写在一行（你的例子）还是多行，但如果它是多行并且文件有.sass扩展名，听起来问题一定出在其他地方