如何垂直对齐具有背景大小的背景图像：封面？答案

【问题标题】：How to vertically align a background image that has background-size: cover?如何垂直对齐具有背景大小的背景图像：封面？
【发布时间】：2014-05-11 09:25:53
【问题描述】：

我有一个带有 background-size: 封面的背景图片的 div。是否可以将背景图像垂直对齐在中心？

我试过background-position: left center e background-position: 0 50%

这是一个小提琴 http://jsfiddle.net/V8X2V/

编辑：

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

【问题讨论】：

什么不适合你？您的两种解决方案效果很好。

标签： css

【解决方案1】：

您可以使用background-position。像这样：

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

演示：JSFIDDLE

【讨论】：

您是否错过了 OP 说他尝试过 background-position 的部分？
@j08691 只是一个错误。如果问题没有解决，我会删除它。