做一个页面居中的div

最新推荐文章于 2021-11-27 11:18:22 发布

lihailinlihailin

最新推荐文章于 2021-11-27 11:18:22 发布

阅读量313

点赞数

分类专栏： css 文章标签： div chrome 测试 ie

本文链接：https://blog.csdn.net/lihailinlihailin/article/details/7592619

版权

css 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<body >
<!--定位div，负责定位窗口中点  -->
	<div id="pos"
		style="position: fixed; top: 50%;left:50%">
		<!-- 内容div，在内部编辑主要内容 -->
		<div id="main"
			style="position: relative;background: green;width: 160px;height: 160px;top:-80px;left:-80px">
			
		</div>
	</div>
</body>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~分割线~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
以上代码在IE和chrome中测试通过，实现main层（div）在页面居中。pos的左上角位于页面的中点，main使用相对定位，向左和上偏移半个长和高，就可以使得main的中点对齐页面的中点了。