制作 Hover Menu ( CSS & Java Script )

Click & Share

部落格教学
素材分享
电脑教学
颜色代码
面子书

效果如上

登入部落格 > 设计 > 添加小工具


<style type="text/css">
#coolmenu{
border: 1px solid #000000;
width: 170px;
background-color: #ffffff;
}

#coolmenu a{
font: bold 13px Verdana;
padding: 2px;
padding-left: 4px;
display: block;
width: 100%;
color: #000000;
text-decoration: none;
border-bottom: 1px solid #000000;
}

html>body #coolmenu a{ /*Non IE rule*/
width: auto;
}

#coolmenu a:hover{
background-color: #000000;
color: #ffffff;
}
</style>

<div id="coolmenu">
<a href="网址">网页名称</a>
<a href="网址">网面名称</a>
<a href="网址">网面名称</a>
<a href="网址">网页名称</a>
<a href="网址">网页名称</a></div>





红色 (链接)
Background-colour : 背景颜色
colour : 字体颜色

蓝色
背景颜色

橙色
字体颜色

紫色
框框厚度 种类 颜色

---