1
我需要为网站做导航。它使用图像而不是文本。文字被隐藏。当然,导航是为了在页面中导航而创建的。我创建了导航,但我无法点击它。我认为这是因为文本被“推到左边”(隐藏换句话说),但没有文本 - 没有链接 - 没有点击。任何想法如何解决它?如何使用可点击的图像进行导航?
HTML:
<div id="navigation">
<ol>
<li class="home"><a href="home">Home</a></li>
<li class="services"><a href="services">Services</a></li>
<li class="gallery"><a href="gallery">Gallery</a></li>
<li class="ourClients"><a href="our-clients">Our Clients</a></li>
<li class="aboutUs"><a href="about-us">About Us</a></li>
<li class="contactUs"><a href="contact-us">Contact Us</a></li>
</ol>
</div>
CSS:
#navigation {
background: url("images/navigation.png");
height: 80px;
}
#navigation li {
float: left;
height: 30px;
margin: 0 60px 0 0;
text-indent: -9999px;
}
#navigation li.home {
background: url("images/navigation_home.png");
width: 54px;
}
#navigation li.services {
background: url("images/navigation_services.png");
width: 61px;
}
/* And so on like 'li.x'. */
尝试玩你声明。减少右边距,即60,看看你得到了什么 – anu 2011-04-16 18:42:26