HTML页面布局

HTML页面布局

创建一个页面划分出 三个部分
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>首页</title>
        <!-- 后期建议将CSS与HTML分离 -->
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}
			
			.header {
				width: 100%;
				height: 4.1125rem;
				background-color: aqua;
			}
			
			.container {
				margin: 1.25rem auto;
				width: 85%;
				height: 31.25rem;
				background-color: aquamarine;
			}
			
			.footer {
				width: 100%;
				height: 6.25rem;
				background-color: antiquewhite;
			}
		</style>
	</head>
	<body>
		<div class="header">
			header
		</div>
		<div class="container">
			container
		</div>
		<div class="footer">
			footer
		</div>
	</body>
</html>

posted @ 2019-09-30 19:46  GetcharZp  阅读(309)  评论(0编辑  收藏  举报