Pinterest，固定 CSS 样式答案

【问题标题】：Pinterest, Pin CSS StylePinterest，固定 CSS 样式
【发布时间】：2015-02-16 21:12:45
【问题描述】：

我正在尝试正确设置 Pin 样式的 CSS。我正在尝试获取确切的 Pinterest Pin 样式，这意味着图像填充容器/盒子，下面是统计信息...

下图显示了我正在尝试制作的 Pinterest Pin。有谁知道图片填充容器/盒子所需的 Css 吗？

谢谢

【问题讨论】：

我现在在这里 -> i.imgur.com/lEeneC8.png ，但无法获取要填写的图像。
不确定这是否会有所帮助，但我之前在 Pinterest 的这个问题上做了一些挖掘工作：stackoverflow.com/questions/14080593/mouseover-image-effect/…
谢谢八月，这不是我现在遇到的问题。但这对我的鼠标悬停有帮助:)
我不明白默认图钉样式有什么区别。
嘿安德烈，我现在在这里 -> i.imgur.com/lEeneC8.png 。如您所见，图像未填满方框（放大以获得更好的视图）。

标签： css sass less pinterest

【解决方案1】：

您只需要确保您的图片与其容器元素的宽度相同。将容器的宽度设置为与图像相同的宽度，并确保容器中没有填充或图像顶部或侧面的边距。

<div class="container">
  <img width="200">
  <div class="meta">
    text
  </div>
</div>

.container { width: 200px; padding: 0; }
.container img { margin: 0; }

Pinterest 的代码有点复杂，但您始终可以使用检查器查看他们具体在做什么。

【讨论】：

天哪.. 这么多小时，我没想到这个...谢谢先生 :)