我们能在.scss文件中编写简单的CSS语法吗？

Question

我们能否在 .scss 文件中编写简单的 CSS 语法？

当我们使用 .scss 时，是否需要直接在 .css 文件中编写任何内容？

这是 .scss 文件的示例代码。

$blue: #3bbfce;
$margin: 16px;

.content-navigation {
  border-color: $blue;
  color:
    darken($blue, 9%);
}

.border {
  padding: $margin / 2;
  margin: $margin / 2;
  border-color: $blue;
}

有时我只想写一个简单的样式，如下所示：

h1 {font-size:3em}

那么我们应该把它放在哪里？只放在.css文件中还是只放在.scss文件中？

我们永远不应该触碰.css文件吗？

- Jitendra Vyas

Answer 1

一旦你开始使用sass，就没有必要再使用css了。

你可以让sass生成css文件，同时手动编辑css文件并将其分别包含在HTML中。但如果你正在编写代码，那么最好全部使用sass。很快你会发现自己使用变量以更“模块化”的方式编写代码，并依赖于sass的扩展语法。

- Keith Nicholas

---

+1 所以即使我们想编写默认的 CSS 样式，也应该在 .scss 中编写，对吗？ - Jitendra Vyas

好的，我们可以并且应该在.scss文件中保留普通的CSS声明。 - Jitendra Vyas

@KeithNicholas，为了展示“奇怪的原因”的例子，请看这个：#test p:media(min-available-width:350px and max-available-width:750px) {background:#8a2be2;} 用于 @element queries。目前，无法将此语法放入SASS中，因为预处理器试图对其进行某些操作，而不是仅仅保留它本来的样子。 - TheFrost

@JitendraVyas 询问 SCSS 中的 CSS，而回答是关于 SASS 的。 - sajal rajabhoj

@sajalrajabhoj Sass有两种不同的语法... https://sass-lang.com/documentation/syntax - Keith Nicholas