Css 背景图片位置动画

Question

我正在尝试制作一个菜单，其中包含附加了 a:hover 的背景图像。我有不同大小的菜单链接，所以我想我可以让图像的一部分左对齐，另一部分右对齐，还有一个可以拉伸的中心图像，当我应用它们时，它会按照我喜欢的方式工作，除了当你第一次将鼠标悬停在它上面时，整个图像向下滑动几个像素到位。当我只使用一个背景图像时我遇到了同样的问题我在使用背景大小包含时遇到了同样的问题。这发生在 Chrome、Firefox 和 Ie 中。 Windows7.

li#menubg1 a:hover, ul li li#menubg1 a:hover {
    background: url("D:\hoverleft.png") no-repeat left, url("D:\hoverright.png") no-repeat right, url("D:\hovermiddle.png") no-repeat center;
    background-size: auto, auto, 100% 34px;
}

Answer 1

    transition: background-size 0s ease-in;
    -moz-transition: background-size 0s ease-in;
    -web-kit-transition: background-size 0s ease-in;

我想我找到了问题的答案

Css 背景图片位置动画

Css background image position animates

css

background

background-image

background-size