绝对定位与行对定位的使用

最新推荐文章于 2023-03-30 09:35:00 发布

烧了回忆取暖

最新推荐文章于 2023-03-30 09:35:00 发布

阅读量708

点赞数

分类专栏： html

本文链接：https://blog.csdn.net/kanuoyuan/article/details/24718621

版权

html 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

看了好多关于绝对定位与相对定位的资料，都感觉晕晕乎乎的不怎么明白，现在试着自己理解，可能不怎么准确

我自己是这样理解的，如果有什么不对的地方，还希望看到我的代码的各位纠正下，对于我自己的理解，我已经测过兼容性，chrome、FF、IE都没什么问题，不知道语法有没有错，来个大神指导指导，谢谢

代码如下：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>绝对定位与行对定位的使用</title>
<style>
*{ margin:0 auto; padding:0 auto;}
body{ position:relative; width:825px;}
#header{ width:825px; height:116px; background:red; position:absolute;}
#nav{ width:825px; height:50px; background:#000; position:absolute; top:116px;}
#content{ width:825px; height:500px; background:yellow; position:absolute; top:166px;}
#footer{ width:825px; height:70px; background:blue; position:absolute; top:666px;}
</style>
</head>

<body>
<div id="header"></div>
<div id="nav"></div>
<div id="content"></div>
<div id="footer"></div>
</body>
</html>