css - 是否可以在保持 "top right"的同时更改背景位置？

Question

我有一个背景位置为“右上角”的对象

我想将这个背景位置向上移动 10px(悬停时)，但是一旦我更改值，新值就会从 0,0 点(左上角)插入，但我想要(右上角)

是否有任何 100% CSS 解决方案？

Answer 1

我想这就是你想要的:

div{
    height:450px;
    width:450px;
    border:1px solid red;
    background-image:url(//IMAGE);
    background-repeat:no-repeat;
    background-position: 100% 0;
}

div:hover{
    background-position: 100% -10px;
}

给它一个 background-position:100% 0 将它设置到右上角。然后从悬停高度减去 10px。

示例: http://jsfiddle.net/jasongennaro/Teyfj/

高度、宽度和边框仅供示例