基于jQuery实现中英文切换导航条效果
29 浏览量
2020-12-28
22:31:22
上传
评论
收藏 47KB PDF 举报
基于基于jQuery实现中英文切换导航条效果实现中英文切换导航条效果
先来看一下中英文切换的导航条中英文切换的导航条效果图：
我采用了两种方式实现，一种用css3,另一种是用jquery实现。
首先说一下用css3如何实现：
html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>首页</title>
<link rel="stylesheet" href="../css/demo2.css">
</head>
<body>
<div class="nav">
<ul class="nav-list">
<li>
<a href="index.html">
<b>index</b>
<i>首页</i>
</a>
</li>
<li>
<a href="index.html">
<b>bbs</b>
<i>论坛</i>
</a>
</li>
<li>
<a href="index.html">
<b>blog</b>
<i>博客</i>
</a>
</li>
<li>
<a href="index.html">
<b>mall</b>
<i>商城</i>
</a>
</li>
<li>
<a href="index.html">
<b>download</b>
<i>下载</i>
</a>
</li>
</ul>
</div>
</body>
</html>
css:
*{
margin:0px;
padding:0px;
font-family: "Microsoft Yahei", Helvetica, sans-serif, Lato;
评论0
最新资源