我最近一直在研究Pinterest网站的页面代码，以学习CSS中的一些设计技巧。我观察到的一件事是他们使用CSS样式设置每个图像的高度。这对我来说很奇怪，因为很明显它们都被调整大小以便具有192px的统一WIDTH。是否有设置高度而不是宽度的技术原因？
示例：
<img src="http://media-cache-ec8.pinterest.com/upload/30962316158222159_nQdVRIXP_b.jpg" alt="Summer camp" class="PinImageImg" style="height: 163px;">
答案 0 :(得分：5)
Pinterest使用JQuery砌体。 http://masonry.desandro.com/ 现在，如果你尝试使用砌体来浮动物体，就像Pinterest一样;无论您放大或缩放多少，都会出现无法排列物体的情况。如果你通过设置对象的宽度来玩游戏;你很快就会意识到“Pinterest的192px”背后的数学。在给出合理的填充和边距之后，您必须为该布置的正确功能指定此特定宽度。我已经开发了一个类似于Pinterest的网站，我们用了一个多星期来解密“Pinterest的192px宽度”背后的逻辑
答案 1 :(得分：0)
图像的“纵横比”并不总是最佳的。有时，当您调整到X高度和Y宽度时，根据宽度/高度比，生成的图像会比预期更宽或更高。如果你在css中设置一个固定的高度，你要确保它永远不会大于那个（并且你的设计不会“破坏”）