效果测试
代码：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>wechat</title><style>* {margin:0;padding: 0;}a {text-decoration: none;}li {list-style-type: none;}.w {width: 1200px;margin:0 auto;padding-top: 14px;}.header {height: 499px;background: url(images/background.jpg);}.logo {float: left;height: 44px;}ul {float: right;}ul li {float: left;margin-left: 10px;}ul li a {color: white;display: inline-block;height: 33px;line-height: 33px;padding-left: 15px;}ul li a span {height: 33px;display: inline-block;padding-right: 15px;outline: 0px;}ul li a:hover {background: url(images/ao.png) no-repeat ;}ul li a:hover span {background: url(images/ao.png) no-repeat right ;}</style></head><body><div class="header"><nav class="w"><a href="/"><img src="images/logo.png" alt="logo" class="logo"></a><ul><li><a href="#"><span>首页</span></a></li><li><a href="#"><span>帮助与反馈</span></a></li><li><a href="#"><span>公众平台</span></a></li><li><a href="#"><span>开放平台</span></a></li><li><a href="#"><span>微信支付</span></a></li><li><a href="#"><span>微信广告</span></a></li><li><a href="#"><span>企业微信</span></a></li><li><a href="#"><span>表情开放平台</span></a></li><li><a href="#"><span>微信网页版</span></a></li></ul></div></nav></body></html>
所用素材：
background.jpg
logo.png
au.png
