简单百度页面模仿

代码部分 非常简单


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Documenttitle>
	<style>
		div {
      
			text-align: center;/*元素居中*/
		}
		body {
      
			font-size: 16px;  /*调整文字大小*/
		}
		.width {
      
			width: 400px; /*调整宽度*/
			height: 20px; /*调整高度*/
		}
		.tj {
      
			height: 30px;
			width: 100px;
		}
		.nav {
      
			height: 60px;
			font-size: 14px;
		}
		.bk {
      
			font-size: 14px;
			height: 60px;
		}
		.sou {
      
			height: 50px;
		}
		.map {
      
			height: 60px;
		}
		.copyright {
      
			line-height: 30px;
		}
		.font{
       font-family:Arial, Helvetica, sans-serif;}
 
	style>
head>
<body>
 
	<div class="logo">
	<img src="img/bdlogo.jpg" alt="" width="500" height="200" title="百度一下,你就知道">
	div>
	<div class="nav">
	<a href="#">新 闻a>
	<a href="#">网 页a>
	<a href="#">贴 吧a>``
	<a href="#">知 道a>
	<a href="#">音 乐a>
	<a href="#">图 片a>
	<a href="#">视 频a>
	<a href="#">地 图a>
	div>
	<div class="sou" >
	<input type="text" class="width"> <input type="submit" value="百度一下" class="tj">
	div>
	<div class="bk">
		<a href="#">百科a>
		<a href="#">文库a>
		<a href="#">hao123a> | 
		<a href="#">更多>>a>
	div>
	<div class="map"><img src="img/ic.jpg" >
	<a href="#">百度地图带你吃喝玩乐,全心全意为人民服务a>
	div>
	<div class="copyright">
		<a href="#">把百度设为主页 a>
		<a href="#">安装百度卫士a>
		<a href="#">加入百度推广a> |
		<a href="#">搜索风云榜a> |
		<a href="#">关于百度 a> |
		<a href="#">About Baidua><br>
		<font>©font>2013 百度使用前必读 京ICP证030173号
	div>
body>
html>

实现效果

简单百度页面模仿_第1张图片

你可能感兴趣的:(web前端,css,html,html5,css3,前端)