HTML如何制作百度首页？代码是什么

制作百度首页时候，除了要用到p进行分块，还需要对快的位置进行控制，一般有

对p进行规范大小width，height分别对应宽度高度

margin：有对p进行定位有margin-top,margin-left,margin-right,margin-buttom

float-left:吧p元素进行从左到右排列

了解这些简单的操作之后，就可以自己动手做出一个简单百度页面了，例如：

上面的页面html代码如下：

  html>
    head>
    	tITle>
    百度一下，你就知道/title>
    	link href="baidu.ico" rel="shortcut icon" tyPE="ico图标路径"/>
    	style>
	.p_head{
    			width:100%;
    			height:150px;
    						margin-top:0px;
	}
		.p_mid{
    			width:100%;
    			height:130px;
    						margin-top:0px;
	}
	.p_body{
    			width:100%;
    			height:200px;
    						margin-top:0px;
	}
	.p_base{
    			width:100%;
    			height:60px;
    						float:left;
    			margin-top:0px;
	}
	.p_based{
    			width:100%;
    			height:100%;
    						float:left;
    			margin-top:0px;
				}
			.p_head1{
    		width:540px;
    		height:24px;
    				float:right;
    		margin-top:25px;
			}
	.p_head2{
    			width:50px;
    			height:24px;
    						float:left;
    			line-height:24px;
    			text-align:center;
				}
	.p_mid1{
    			width:270px;
    			height:130px;
    						float:left;
    						margin-left:39%;
	}
		.p_body1{
    			width:600px;
    			height:36px;
    			background-color:#999;
    			float:left;
    						margin-left:32%;
	}
			.p_base1{
    			width:60px;
    			height:60px;
    			margin:0 auto;
    			float:left;
    			margin-top:5%;
	}
     	/style>
    /head>
    body style="margin:0 auto">
    	p class="p_head" >
    			p class="p_head1">
    					p class="p_head2" >
    font size="1" >
    ins>
    新闻 /ins>
    /font>
    /p>
                   					p class="p_head2" >
    font size="1" >
    ins>
    hao123/ins>
     /font>
    /ins>
    /p>
     					p class="p_head2" >
    font size="1" >
    ins>
    地图 /ins>
    /font>
    /p>
     					p class="p_head2" >
    font size="1" >
    ins>
    资源 /ins>
    /font>
    /p>
     					p class="p_head2" >
    font size="1" >
    ins>
    视频 /ins>
    /font>
    /p>
     					p class="p_head2" >
    font size="1" >
    ins>
    贴吧 /ins>
    /font>
    /p>
     					p class="p_head2" >
    font size="1" >
    ins>
    学术 /ins>
    /font>
    /p>
     					p class="p_head2" >
    font size="1" >
    ins>
    登录 /ins>
    /font>
    /p>
     					p class="p_head2" >
    font size="1" >
    ins>
    设置 /ins>
    /font>
    /p>
    					p class="p_head2" style="width:70px;
    background-color:#38f" >
    font size="1" color="white" >
    更多产品/font>
    /p>
     			/p>
    	/p>
     	p class="p_mid" >
    			p class="p_mid1" >
    			a href="https://www.baidu.COM/s?wd=%E7%BD%91%E7%BB%9C%E8%A1%A8%E6%83%85%E7%AC%A6%E5%8F%B7%E8%AF%9E%E7%94%9F&
    sa=ire_dl_gh_LOGo&
    rsv_dl=igh_logo_pcs" target="_blank">
    				img  height=130 width=270 src="https://www.baidu.com/img/bd_logo1.png?where=super" title="百度一下你就知道"/>
    			/a>
    	 		/p>
    	/p>
     	p class="p_body" >
    			p class="p_body1" >
    					form action="https://www.baidu.com/s"  method="get"  >
    					input style="width:500px;
    height:36px;
    "type="text"/>
    input id="gender" name="gender" type="submit"  value="百度一下"style="width:100px;
    height:36px;
    "/>
    						/form>
    			/p>
    	/p>
    		p class="p_base" >
    				p class="p_base1" style="margin-left:48%;
    ">
    						img  height=60 width=60 src="https://ss1.bdstatic.com/5en1bjq8AAUYm2zgoY3K/r/www/cache/static/PRotocol/https/home/img/qrcode/zBIOS_efde696.png" title="我是一个二维码"/>
    				/p>
    	/p>
    		/body>
    /html>
    

以上就是对HTML如何制作百度首页？代码是什么的全部介绍，如果您想了解更多有关HTML视频教程@H_304_22@，请关注PHP中文网。

以上就是HTML如何制作百度首页？代码是什么的详细内容，更多请关注其它相关文章！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！