如何垂直对齐一个具有“background-size：cover”的背景图像？

Question

我有一个带有background-size: cover背景图片的div。是否可能将背景图片垂直居中对齐？

我尝试了background-position: left center和background-position: 0 50%

这是一个fiddle http://jsfiddle.net/V8X2V/ 编辑：

实际上，background-position: left center;有效！我的问题是我在背景中有一个内联样式，并且试图在css文件中添加background-position，因为某种原因它不起作用。但是当我将位置放在内联中时，它可以工作...

- igrossiter

---

什么对你不起作用？你的两个解决方案很有效。 - Sunyatasattva

Answer 1

您可以使用`background-position`属性。例如：

div {
    background: url(http://placekitten.com/400/400);
    background-size: cover;
    width: 300px;
    height: 150px;
    background-position: 0% 30%;
}

---

DEMO : JSFIDDLE

- Farzad

---

你有没有注意到原帖作者说他已经尝试了 background-position 这一部分？ - j08691

@j08691 只是一个错误。如果问题没有解决，我会将其删除。 - Farzad