天天看点

div+css制作的菜单

<style type="text/css">

<!--

.Menu { width:350px; margin:12px 0px 0px 175px; height:30px; line-height:30px; text-align:center; }

.Menu ul { list-style:none; margin:0px;}

.Menu li { float:left; padding-left:8px; } //如果要显示竖型列表菜单请把float:left属性去掉

.Menu a { background:url(img/arrow2.gif) no-repeat left; padding-left:10px; color:#457a8b; font-size:14px; font-weight:bold; }

.Menu a:link { background:url(img/arrow2.gif) no-repeat left; padding-left:10px; color:#457a8b; }

.Menu a:visited { background:url(img/arrow2.gif) no-repeat left; padding-left:10px; color:#457a8b; }

.Menu a:hover { background:url(img/arrow1.gif) no-repeat left; padding-left:10px; color:#78b4c7; }

.Menu a:active { background:url(img/arrow1.gif) no-repeat left; padding-left:10px; color:#78b4c7; }

-->

</style>

<div class="Menu">

<ul>

 <li><a title="学习" href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" >学习</a></li>

 <li><a title="技术" href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" >技术</a></li>

 <li><a title="专题" href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" >专题</a></li>

 <li><a title="博客" href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" >博客</a></li>

 <li><a title="论坛" href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" >论坛</a></li>

</ul>

</div>