【问题标题】:SASS change nested elements class naming styleSASS 改变嵌套元素类命名风格
【发布时间】:2014-06-24 09:42:03
【问题描述】:

我想在 SASS 中使用 SMACSS 命名系统。 期望以下 SASS 代码:

nav
  ul
    margin: 0
    padding: 0
    list-style: none

作为输出我会得到

nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

但根据 SMACSS 方法,类命名应如下所示:

nav-ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

您能否建议如何更改 SASS 中的类命名样式以实现此目标?

【问题讨论】:

    标签: css sass smacss


    【解决方案1】:

    你可以这样写:

    nav
      &-ul
        margin: 0
        padding: 0
        list-style: none
    

    结果:

    nav-ul {
      margin: 0;
      padding: 0;
      list-style: none;
    }
    

    【讨论】:

    • 非常感谢!效果很好!但是有什么方法可以改变编译配置来用你提供的东西代替标准命名?
    • 遗憾的是我不知道。但我认为拥有这种语法并不总是有帮助。例如对于像ul > li 这样的选择器。也许对 SMACSS 有更深入了解的人可以提供一些相关信息。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-01-16
    • 1970-01-01
    • 1970-01-01
    • 2014-05-14
    • 2015-10-08
    • 2012-08-22
    • 1970-01-01
    相关资源
    最近更新 更多