html - 对齐背景图像中心，并相对上下(垂直)调整

Question

我有一个 slider div，上面有一个背景图像。由于背景图像不适合(太大)，它居中:

http://jsfiddle.net/s5qvY/

<div id="slider"></div><hr><hr><img src="http://hdwallpaper2013.com/wp-content/uploads/2013/02/Download-Flower-Background-Images-HD-Wallpaper.jpg" width="100%" />

#slider
{
    width: 100%;
    height: 100px;
    background-size: 100% auto;
    background-position: center;
    background-image: url('http://hdwallpaper2013.com/wp-content/uploads/2013/02/Download-Flower-Background-Images-HD-Wallpaper.jpg');
}

现在我想相对于这个居中向上或向下移动图像。我在这里看到了一种解决方案(抱歉我能找到):

padding-top: 10px;底部边距:-10px;

但这只能在一个方向上起作用，它只能将图像向上推。像这样向下移动是不可能的(负边距)。

有什么想法吗？

Answer 1

使用 background-position 属性(参见 here )

background-position: 50% 10%;

您可以更改第二个值以对齐背景垂直度。