Question

我正在寻找一个笨拙的工具来解析我的CSS并告诉我何时可以将longhand css属性转换为速记。我认为这会使css更小，更容易理解。

所以基本上如果能找到

.mydiv{
  background-color: #000;
  background-image: url(images/bg.gif);
  background-repeat: no-repeat;
  background-position: top right;
  font-style: italic;
  font-weight: bold;
  font-size: .8em;
  line-height: 1.2;
  font-family: Arial, sans-serif;
}

它会将其更改为：

.mydiv{
  background: #000 url(images/bg.gif) no-repeat top right;
  font: italic bold .8em/1.2 Arial, sans-serif;
}

令我惊讶的是我无法找到这样的插件，但另一方面我发现很多将速记属性转换为手写的。这提出了一个问题：

为什么人们想要将他们漂亮干净的速记等值转换成手写？除了以下是否有任何正当理由：

我喜欢它更长
一些真正过时的浏览器就像IE 7搞砸了一些东西。（过时我的意思是IE＆lt; = 7，chrome，ff，safari 2版本低于当前版本）

P.S。我也不是要求一个咕噜插件，如果有人知道，请告诉我。

P.P.S 我看到了this question，这个人关注的是：性能和文档。我不关心这些事情是因为：我的团队中的人可以阅读和理解速记并且更喜欢它，而且我知道性能方面（对于解析规则）它会产生很小的差异（如果有的话）并且在带宽的情况下它更小。

我担心的是，我可能会在某些浏览器中获得不同的表示形式。

Answer 1

有时候是必要的，所以你可以对你的风格进行更好的控制，这样你就可以创造出典型案例之外的东西。

考虑这个长边框语法的例子：

section{
  max-width: 60em;
  margin: 0 auto;
}
p {
  border-color: black;
  border-style: solid;
  border-top-width: 1px;
  border-left-width: 1px;
  border-right-width: 1px;
}

这会创建一个非常不同的边框。没有办法用短手独自完成如此简洁的方式。

演示：http://codepen.io/agconti/pen/sixaL

为什么css手写等效有用

1 个答案: