导航链接添加背景图片替换样式

 

HTMl代码:

<div class="welcome_button">
  <ul>
	<li><a href="#">signup</a></li>
	<li><a href="#">login</a></li>								
  </ul>
</div>

 

CSS样式:

<style type="text/css">
.welcome_button { text-align: center; } .welcome_button ul { list-style:none; padding-top: 12px; padding-left: 130px; } .welcome_button ul li { background:url(../img/welcome_button.jpg) no-repeat top center; width:190px; height:56px; text-align: center; line-height: 50px; margin-top:30px; } .welcome_button ul li a { color: #ffffff; display:block; text-decoration: none; } .welcome_button ul li a:hover { background:url(../img/welcome_button_hover.jpg) no-repeat; width:190px; height:56px; text-align: center; line-height: 50px; color: #fff; }
</style>

  

posted @ 2014-04-28 10:07  Emily1130  阅读(314)  评论(0编辑  收藏  举报