css - 块中 stylelint 的默认属性顺序是什么？

Question

我知道答案应该很容易找到，但是我在stylelint 的官方网站上找到的唯一对“订单”的引用是stylelint-order 插件，这看起来很有趣，但对于我的需求来说有点过分了（不打算安装并暂时配置它）。

Stylelint 建议（通过发送警告）块内的特定属性顺序，即这个块：

.my-class {
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  overflow-x: hidden;
  background: #dadada;
}

property-sort-order将在所有内部行中发送警告。那么需要的顺序是什么？

Answer 1

它只是字母（AZ）。因此，为了避免 stylelint 警告，该块中的属性应该像这样排序：

.my-class {
  background: #dadada;
  height: 100%;
  overflow-x: hidden;
  position: absolute;
  right: 0;
  top: 0;
}

但是，使用SASS 插值，可以像这样忽略此订单执行：

$bg: background;

.my-class {
  height: 100%;
  overflow-x: hidden;
  position: absolute;
  right: 0;
  top: 0;
  #{bg}: #dadada;
}