Airbnb | Css规范

Airbnb css/sass编码规范

1 格式

• 使用软制表符（2个空格）进行缩进。
• 在类名中，最好使用破折号而不是驼峰式铸造。
• 如果使用的是BEM，则可以使用下划线和PascalCasing（请参见下面的OOCSS和BEM）。
• 不要使用ID选择器。
• 在规则声明中使用多个选择器时，请为每个选择器分配自己的行。
• 在规则声明的左大括号{之前放置一个空格。
• 在属性中，在:字符之后（但不能在字符之前）放置一个空格。 将}规则声明的右花括号放在新行上。
• 在规则声明之间放置空白行。

Bad
.avatar{
    border-radius:50%;
    border:2px solid white; }
.no, .nope, .not_good {
    // ...
}
#lol-no {
  // ...
}
Good
.avatar {
  border-radius: 50%;
  border: 2px solid white;
}

.one,
.selector,
.per-line {
  // ...
}

2. 注释

建议使用行注释 (在 Sass 中是 //) 代替块注释。
建议注释独占一行。避免行末注释。

3. OOCSS 和 BEM

鼓励使用 OOCSS 和 BEM 的某种组合：

• 可以帮助我们理清 CSS 和 HTML 之间清晰且严谨的关系。

• 可以帮助我们创建出可重用、易装配的组件。

• 可以减少嵌套，降低特定性。

• 可以帮助我们创建出可扩展的样式表。

OOC