CSS滚动的水平导航

时间:2011-03-30 21:16:49

标签: html css css-sprites

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

<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

1 个答案:

答案 0 :(得分:3)

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

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

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