新闻资讯

新闻资讯 产品更新

div+css实现绿色导航并且带鼠标经过特效

编辑:007     时间:2015-06-12
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>div+css实现绿色导航并且带鼠标经过特效</title>

</head>

<body>

<style type="text/css">
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;}
body{font:12px/180% Arial, Helvetica, sans-serif, "新宋体";}

/* nav */
.nav{margin:28px auto 0 auto;height:40px;background:#008080;width:960px;}
.nav a{display:block;float:left;padding:9px 0px 9px;cursor:pointer;}
.nav a font{display:block;width:117px;height:22px;border-left:1px #009999 solid;border-right:1px #2F4F4F solid;color:#fff;text-align:center;font-size:16px;font-family:"微软雅黑";}
.nav a{text-decoration:none;color:#fff;}
.nav a:hover{background:#009999;color:#fff;text-decoration:none;}
</style>

<div class="nav">
    <a href="http://www.rongsoft.cn/"><font style="border-left:none;">首页</font></a>
    <a href="http://www.rongsoft.cn/"><font>JS特效代码</font></a>
    <a href="http://www.rongsoft.cn/"><font>网站常用代码</font></a>
    <a href="http://www.rongsoft.cn/"><font>教程文章</font></a>
    <a href="http://www.rongsoft.cn/"><font>网页小图标</font></a>
    <a href="http://www.rongsoft.cn/"><font>前段插件</font></a>
    <a href="http://www.rongsoft.cn/"><font>各种cms</font></a>
    <a href="http://www.rongsoft.cn/"><font style="border-right:none">帮助中心</font></a>
</div>


 <div style="width:960px;margin:10px auto; clear:both; text-align:center;  ">
<script src="/statics/js/ad/96090.js" type="text/javascript"></script>
</div>
<div style="width:960px;margin:20px auto; clear:both; text-align:center; font-size:12px; line-height:25px;    ">
<a href="http://www.rongsoft.cn"  style="color:#333"><strong>烟台荣华软件原创技术</strong></a> </strong>
<br>
<strong>8019996</strong> <a target="_blank" href="http://www.rongsoft.cn"><img border="0" src="http://www.rongsoft.cn/upload/shangchuan/images/111.png" alt="烟台荣华软件原创技术" title="烟台荣华软件原创技术"></a> <a style="list-style:none" href="http://www.rongsoft.cn" target="_blank"><strong>烟台荣华软件</strong></a>
<script src="/statics/js/inc_share.js"  type="text/javascript"></script>
<script src="/statics/js/inc_statistics.js"  type="text/javascript"></script>
<script src="/statics/js/inc_monitor.js"  type="text/javascript"></script>
</div>
</body>
郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

回复列表

相关推荐