我有一个导航菜单中的链接的悬停状态看起来像这样,圆角没有JavaScript或CSS3
正如你可以看到有一个圆角的背景在橙色背景设置。客户已经要求通过IE6正常工作(他们还没有到可以升级的阶段)。现在我刚刚进入网络开发阶段,所以我没有学到如何达到这个效果的老技术,请问能否给我一些启发?以下是我的代码,目前我正在使用CSS3。
#navPrimary {
background:#de4702;
height:37px;
margin:0px auto;
width:517px;
padding:5px 0px 0px 0px;
display:block;
overflow:hidden;
}
#navPrimary li {
width:252px;
float:left;
display:block;
height:100px;
list-style-type:none;
text-align:center;
margin:0px 0px 0px 8px;
}
#navPrimary li.first {
width:67px;
padding:0px 14px 0px 14px;
display:block;
margin:0;
}
#navPrimary .last {
width:154px;
}
#navPrimary li a {
color:#fff;
font-weight:bold;
text-decoration:none;
display:block;
height:27px;
padding:10px 0px 0px 0px;
}
#navPrimary li a:hover {
color:#de4702;
background:#fff;
-moz-border-radius:10px 10px 0px 0px;
-webkit-border-radius:10px 10px 0px 0px;
border-radius:10px 10px 0px 0px;
}
<ul id="navPrimary">
<li class="first"><a href="/" title="#request.sitename# | Home">Home</a></li>
<li><a href="##" title="Free Admission">Free Admission </a></li>
<li class="last"><a href="#request.public_vroot#index.cfm?fuseaction=game.terms" title="Terms & Conditions">Terms & Conditions</a></li>
</ul>
他们无法从IE6升级?只需下载Firefox!这是IE *迄今为止最先进的版本! – Blender 2011-03-30 15:01:19
我不认为你可以用CSS来做IE6。你将不得不使用图像。 – LostLin 2011-03-30 15:02:34