CSSOnDiet 1.8.4

使用旧css

.element {
  letter-spacing: 2px;
  background-color: #1C6BA0;
}

如果所有css声明都在单独的行上，则不必 更改任何内容

去除冒号

.element {
  letter-spacing 2px
  background-color #1C6BA0
}

在css中，可以选择饮食中的冒号和分号

使用助记符

.element {
  les 2p
  bac #1C6BA0
}

常用的css关键字有助于记忆。参数是3个字母长， 值2，单位只有1个字母（The list）

媒体断点

@cod-media {
  tablet (min-width: 768px)
}
.element {
  les 2p
  les 3p @tablet
}

响应式网页设计从未如此简单直观

单行注释

.element {
  les 2p // why not 3?
  bac #1C6BA0 // deep ocean
}

无需记住关闭这些评论

嵌套注释

.element {
  /*
  les /*3p*/ 2p
  */
  bac #1C6BA0
}

现在您可以在代码中注释其他注释。最后…

算术

.element {
  les 3p-1
  bac #1C6BA0
}

css需要计算。这是非常肯定的。

短rgba

.element {
  les 3p-1
  bac #1C6BA0F1
}

再加两位数，颜色就透明了

变量

@cod-defines {
  sp2014 3p-1
  ocean #1C6BA0F1
}
.element {
  les sp2014
  bac ocean
}

定义就像变量。写一次，随便用。保持干燥！

@cod-defines {
  sp2014 3p-1
  ocean bac #1C6BA0_ARG1_ ;\
        bai url("fish.png")
}
.element {
  les sp2014
  ocean(F1)
}