css - SASS 在多行上缩进语法?

标签 css sass

我喜欢 Sass 的 indented syntax (与 SCSS 相反,SCSS 与空格无关并使用方括号和分号)。我认为它更干净。

我有一个问题。如果我有一个很长的行,就没有办法将它分成多行(例如,遵守 80 个字符的限制)

以这个非常长的 mixin 声明为例,它最初是用 SCSS 编写的。

@mixin col($cols, $mleft: 0, $mright: 0, $include-margin: false, $border: 0,
           $pleft: 0, $pright: 0, $include-padding: true, $extra: 0, 
           $clear: false, $lead: true, $container: false) {
    color: red;
    display: block;
}

我能够将一个长声明拆分成多行。使用缩进语法,我认为没有办法。我必须将声明放在一行中,这样可读性较差。

@mixin col($cols, $mleft: 0, $mright: 0, $include-margin: false, $border: 0, $pleft: 0, $pright: 0, $include-padding: true, $extra: 0, $clear: false, $lead: true, $container: false)
    color: red
    display: block

有什么我不知道的方法吗? :(

最佳答案

sass 不支持多行。阅读文档,有一个异常(exception),当涉及多个 css 选择器时,如本例所示:

.users #userTab,
.posts #postTab
  width: 100px
  height: 30px

在这里阅读文档:http://sass-lang.com/docs/yardoc/file.INDENTED_SYNTAX.html#multiline_selectors

所以,遗憾的是:在 sass 中不可能获得对参数列表的多行支持。

关于css - SASS 在多行上缩进语法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30574909/

相关文章:

css - 如何修复 Chrome 和 Firefox 中的主要边距问题编程?

css - 是否有 "is descendant or has class"的 sass/css 选择器?

css - 属性值的 SASS 函数/混合

css - 在 <p> 中设置 CSS 样式不起作用 - Codeigniter

html - 将文本的基线与另一个元素的顶部对齐 (CSS)

javascript - 更改 iframe 内图像的元素样式

Angular 2 + Material : Unable to use map-get with 2nd parameter "text", "card"等

reactjs - Jest + SCSS @import 问题(css 模块)

css - 编译为 css 时忽略 Gulp

html - 如何为标题标题添加部分边框?