效果
代码中的图片可以自己换的
下拉菜单HTML代码
下拉菜单CSS代码
在写完上述代码的同时须加上css的重置代码，代码如下：
* {
margin: 0;
padding: 0
}
em,i {
font-style: normal
}
li {
list-style: none
}
a{
font: 14px/24px Microsoft YaHei,Arial,\\5B8B\4F53,Arial Narrow;
letter-spacing: 1.2px;
color: #666;
text-decoration: none
}
a:hover {
color: #c81623 ;
}
img {
border: 0;
vertical-align: middle
}
input{
outline: none;
}
button {
cursor: pointer;
border:none;
outline: none;
}
<header class="header"> <div class="header_left"> <img src="img/logo.jpg"> </div> <div class="header_right"> <div class="number_right"> <img src="img/number.jpg"> </div> <ul> <a href="#"><li>首页</li></a> <a href="#"><li class="show_list"> <span>成功案例</span> <ul class="move_list"> <li>品牌设计</li> <li>网页设计</li> <li>平面设计</li> <li>电子商城</li> <li>空间/建筑</li> </ul> </li></a> <a href="#"><li>我要设计</li></a> <a href="#"><li>在线咨询</li></a> <a href="#"><li>会员注册</li></a> <a href="#"><li>会员登录</li></a> </ul> </div> </header>版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/144804.html原文链接：https://javaforall.net
