百度页面

来源：互联网发布：python跟按键精灵编辑：程序博客网时间：2024/06/03 18:33

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head><meta http-equiv="Content-Type" content="text/html;charset=UTF-8"><title>百度</title><style type="text/css">/* 设置主体的宽度，高度，文本居中，自定义对齐 */body{width:1000px;height:1200px;text-align:center;margin:0px auto;}/* 设置ul的宽度，自定义对齐，点样式剔除  内边距为0*/.ul1 ul{width:600px;height:50px;margin:0px auto;list-style:none inside;padding:0px;}/* .ul1 ul li设置li标签内容向左浮动，行高50px */.ul1 ul li{float:left;width:75px;line-height:50px;}/* 分别设置输入框和提交按钮的宽度和高度 */.int1{height:38px;width:500px;}.int2{height:45px;width:120px;}/* 设置ul1类中a标签链接样式黑色（鼠标指针放在显示颜色） */.ul1 a:hover{color:black;}.ul2 ul{width:280px;margin:0px auto;padding:0px;list-style:none inside;height:40px;}.ul2 ul li{float:left;width:56px;line-height:40px;}/* 清除所有浮动，向左清除浮动（clear:left）,向右清除浮动（clear:right） */.zhuye{clear:both;margin-top:150px;}.ul3 ul{width:400px;height:50px;margin:0px auto;list-style:none inside;padding:0px;}.ul3 ul li{width:98px;float:left;}/* 剔除所有的a标签的链接下划线样式 */a{text-decoration: none;}</style></head><body><!-- 设置logo --><p class="logo"><img src="bdlogo.gif" height="129px" width="270px" alt="" /></p><!-- 设置导航菜单 --><div class="nov"><ul> <li><a href="#">新闻</a></li><li><a href="#">网页</a></li><li><a href="#">贴吧</a></li><li><a href="#">知道</a></li><li><a href="#">音乐</a></li><li><a href="#">图片</a></li><li><a href="#">视频</a></li><li><a href="#">地图</a></li></ul></div><!-- 创建文本框 并设置类选择器--><p class="serach"><form action="" method="post" name="" ><input type="text" value=""  class="int1" / ><input type="submit" value="百度一下" class="int2" /></form></p><div class="ul2"><ul><li><a href="#">百科</a></li><li><a href="#">文度</a></li><li><a href="#">hao123</a></li><li>|</li><li><a href="#">更多>></a></li></ul></div><p class="zhuye"><a href="">把百度设为主页安装百度浏览器</a></p><div class="ul3"><a href="#">加入百度推广</a>  |  <a href="#">搜索风云榜</a>  |  <a href="#">关于百度</a>  |  <a href="#">About Baidu</a></div><p class="dibu">2013 Baidu 使用百度前必读 京ICP证030173号</p></body></html>

总结：认识导航菜单用浮动属性实现，输入文本框的宽度可以设置类标签来实现

0 0