div+css对网页进行整体布局的案例

最新推荐文章于 2020-09-13 09:58:31 发布

ydcun

最新推荐文章于 2020-09-13 09:58:31 发布

阅读量1.3k

点赞数

分类专栏： SSH 文章标签： div css float xhtml html 文档

本文链接：https://blog.csdn.net/manageer/article/details/7913611

版权

SSH 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

下面简单写一个div+css对网页进行那个整体架构的案例：

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
body{
	margin:0px;
}
#centen{
	width:1000px;
	margin:0 auto;
}
#body{
	width:1000px;
	border:solid 1px #000;
}
#head{
	width:1000px;
	height:100px;
	background-color:#0F0;
	margin-bottom:10px;
}
#left{
	background-color:#039;
	margin-right:10px;
	float:left;
	height:500px;
	width:250px;
}
#main{
	float:left;
	background-color:#996;
	height:500px;
	width:480px;
}
#right{
	float:right;
	background-color:#00F;
	height:500px;
	width:250px;
}
#bout{
	float:left;
	background-color:#0F0;
	height:100px;
	width:1000px;
}
</style>
</head>

<body>
<div id="centen">
	<div id="body">
    	<div id="head"></div>
        <div id="left"></div>
        <div id="main"></div>
        <div id="right"></div>
        <div id="bout"></div>
    </div>
</div>
</body>
</html>

ydcun

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
div+css对网页进行整体布局的案例

下面简单写一个div+css对网页进行那个整体架构的案例：无标题文档body{ margin:0px;}#centen{ width:1000px; margin:0 auto;}#body{ width:1000px; border:solid 1px #000;}#head{ width:1000px; heigh
复制链接

扫一扫

专栏目录