html内容：
<html>
<head>
<link rel="stylesheet" type="text/css" href="baidu.css" />
</head>
<body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="baidu.js"></script>
<ul class="nav1">
<li><a href="https://www.nuomi.com">糯米</a></li>
<li><a href="http://news.baidu.com">新闻</a></li>
<li><a href="https://www.hao123.com">hao123</a></li>
<li><a href="http://map.baidu.com">地图</a></li>
<li><a href="http://v.baidu.com">视频</a></li>
<li><a href="http://tieba.baidu.com">贴吧</a></li>
<li>登陆</li>
<li>设置</li>
<li class="mor">更多产品</li>
<ul class="nav2">
<li>图片</li>
<li>音乐</li>
</ul>
</ul>
<img class="picture" src="C:\Users\v-zixli\Desktop\DEMO\bd_logo1.png" width="220px" height="120px" alt="logo" />
<div class="search">
<input type="text" class="txt1">
<button>百度一下</button><br><br>
<ul class="shopping">
<li>11.11狂欢：</li>
<li><a href="http://wwww.jd.com">京东商城 </a></li>
<li><a href="http://www.suning.com/">苏宁易购 </a></li>
<li><a href="http://www.yhd.com/">1号店</a></div></li>
</ul>
</div>
</body>
</html>
ul.nav1
{
float: right;
}
ul.nav1 li
{
display: inline;
padding: 5px;
}
ul.nav2 li
{
position: relative;
left: 350px;
display: block;
}
.picture
{
position:relative;
left: 40%;
top:20%;
}
img
{
display: block;
}
.search
{
position: relative;
left: 30%;
top: 25%;
}
.search .txt1
{
width: 400px;
height: 30px;
}
ul.shopping li
{
display: inline;
padding: 3px;
}
button
{
height: 30px;
}
$(document).ready(function(){
$("ul.nav2").hide()
$("li.mor").hover(function(){
$("ul.nav2").show()
},
function(){
$("ul.nav2").hide()
})
})
扫一扫
1233
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
