菜鸟制作的Html,悬停和选择效果

时间:2012-09-20 19:29:23

标签: html css menubar

<div id="zgoraj">
                <a  href="">Domov</a>
                <a   href="">Moj profil</a>
                <a   href="">Administracija</a>
                <a  href="" >Urejanje urnikov</a>
                <a   href="">Statistike</a>
            </div>
<style>
#zgoraj{
width:670px;
background-color:#FF8000;
height:54px;

}
#zgoraj a{
border-style:solid;
border-width:2px;
border-color:black;
padding-top: 20px;
display:block;
float:left;
width:130px;
height:30px;
text-decoration:none;
color:white;
text-align:center;
/*box-shadow: 0 -7px 22px 6px #000000 inset;*/
}
#zgoraj a:hover{
    color:black;
    background-color:white;

}

</style>

这是我的“菜单栏”的代码。当选择A链接并且您被重定向到指定的URL时,我希望悬停效果保持不变(我将编辑href attributte)。

1 个答案:

答案 0 :(得分:1)

假设您在每个页面的顶部都有相同的菜单,您需要更新CSS以为您的悬停样式添加额外的类定义:

#zgoraj a:hover, #zgoraj a.active {
  color:black;
  background-color:white;
}

然后将'class =“active”'添加到&lt; a&gt;应突出显示的元素。