2021-06-06

最新推荐文章于 2024-07-11 17:28:05 发布

qq_51929114

最新推荐文章于 2024-07-11 17:28:05 发布

阅读量212

点赞数 3

分类专栏： C++小白文章标签： css html

本文链接：https://blog.csdn.net/qq_51929114/article/details/117638358

版权

C++小白专栏收录该内容

9 篇文章 0 订阅

订阅专栏

HTML+CSS制作百度界面

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>百度一下，你就知道</title>
	<style type="text/css">
			.head{  color:#fff;position:absolute;left:0;top:0;margin:19px 0 5px;padding:0 96px 0 0;}
        .mav{float: left;color: #333;font-weight: 700;line-height: 24px;margin-left: 20px;font-size: 13px;text-decoration:underline;}
		.head a:hover{color:#00c}
		.centers{text-align: center;}
		.gen{position: absolute;right: 10px;width: 60px;height: 23px;float: left;color: #fff;background: #3385ff;line-height: 24px;font-size: 13px;text-align: center;border-bottom: 1px solid #38f;margin-left: 19px;text-decoration: none}
		.imgs{margin-top: 30px}
		.sone{border: 1px solid #b6b6b6;background: #fff;display: inline-block;vertical-align:top;width: 539px;height:34px;border-color: #b8b8b8 #ccc #ccc #b8b8b8;overflow: hidden;}
		span{margin: 0;padding: 0}
		input{border: 0;padding: 0;}
		.head{text-decoration: none;color: gray;}
		.sou{width: 526px;height: 22px;font: 16px/18px arial;line-height: 18px;margin: 6px 0 0 7px;padding: 0;outline: 0;}
		.btn{width: 100px; height: 36px; color: #fff; font-size: 15px; letter-spacing: 1px; background: #3385ff;} 
		.tail{text-align: center;}
		.one{height: 191.5px;}
		p,p>a{color: #999; line-height: 22px; font: 12px arial;}
		#lh a{margin-right:12px;}
	
	</style>
</head>
<body>
<div class="baidu">
	<div class="head">
		<a href="http://news.baidu.com/" target="_blank">新闻</a>
        <a href="https://www.hao123.com/" target="_blank">hao123</a>
        <a href="http://map.baidu.com/" target="_blank">地图</a>
        <a href="http://v.baidu.com/" target="_blank">视频</a>
        <a href="http://tieba.baidu.com/" target="_blank">贴吧</a>
        <a href="http://www.baidu.com/more/">更多</a>
        <a href="#">设置</a>
        <a href="https://passport.baidu.com/v2/?login&tpl=mn&u=http%3A%2F%2Fwww.baidu.com%2F&sms=5">登录</a>
	</div>
 
	<div class="centers">
		<div class="imgs">
			<img src="123.jpg.png" width="270" height="129">
		</div>
		<span class="sone">
			<input type="text" name="" class="sou" maxlength="255">
		</span>
		<span>
			<input class="btn" type="submit" value="百度一下">
		</span>
	</div>
 
	<div class="tail">
		<div class="one"></div>
		<div class="thr">
			<p id="lh">
				<a href="//www.baidu.com/cache/sethelp/help.html" target="_blank">设为首页</a>
				<a href="http://home.baidu.com">关于百度</a>
				<a href="http://ir.baidu.com">About  Baidu</a>
				<a href="http://e.baidu.com/?refer=888">百度推广</a>
				<a href="https://www.baidu.com/duty">使用百度前必读</a>
				<a href="https://help.baidu.com/newadd?prod_id=1&category=4">意见反馈</a>
				<a href="https://help.baidu.com/">帮助中心</a>
				<a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11000002000001">京公网安备11000002000001号</a> 
				<a href="https://beian.miit.gov.cn/">京ICP证030173号</a> 
				<a>©2021 Baidu  </a>
				<a> (京)-经营性-2017-0020信息网络传播视听节目许可证   </a>
				<a>0110516</a>
			</p>
			
		</div>
		
	</div>
</div>
</body>
</html>

在这里插入图片描述

qq_51929114

关注

3
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2021-06-06

HTML+CSS制作百度界面<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>百度一下，你就知道</title> <style type="text/css"> .head{ color:#fff;position:absolute;left:0;top:0;margin:19px 0 5px;padding:0 96px 0 0;}
复制链接

扫一扫