Question

翻转使用一个图像作为悬停。这很酷，但我不知道如何让它在水平菜单中工作。我该怎么办？

<head>
<style>
/*CSS HOVER WITH ONE IMAGE*/
#emailUs{display: block;width: 107px;height: 23px;background: url("slide.jpg") no-repeat 0 0;}
#emailUs:hover{background-position: 0 -23px;}
#emailUs span{position: absolute;top: -999em;}
</style>
</head>
<body>
<!--Trying to get three buttons to go across 'same button as example'-->
<a id="emailUs" href="#" title="Email Us"><span>Email Us</span></a>
<a id="emailUs" href="#" title="Email Us"><span>Email Us</span></a>
<a id="emailUs" href="#" title="Email Us"><span>Email Us</span></a>
</body>
</html>
</html>

CSS SPRITE
enter image description here

Answer 1

我相信你正在寻找css：“float：left;”

一旦你设置了一个链接“display：block;”，它会自动转到下一行 - 所以 - 让它们向左浮动会把它们带回到水平线上。

此外，您不应该有多个具有相同ID的元素。使用class代替您在多个元素上需要的任何东西。

CSS滚动的水平导航

1 个答案: