2020-12-8

最新推荐文章于 2024-10-02 13:25:04 发布

张张养帅柴

最新推荐文章于 2024-10-02 13:25:04 发布

阅读量146

点赞数

分类专栏：绝对定位文章标签： css html5

本文链接：https://blog.csdn.net/qq_44922719/article/details/110870778

版权

绝对定位专栏收录该内容

1 篇文章 0 订阅

订阅专栏

本文介绍了CSS中的相对定位(relative position)，强调了相对定位是相对于元素自身的content进行的，不考虑margin和padding。示例中展示了如何使用相对定位让子元素<div class='so'>相对于父元素<div class='fa'>进行定位，父元素设置了padding和margin，背景为黄色，子元素为红色，大小为50x50像素，并绝对定位。

摘要由CSDN通过智能技术生成

相对定位

子元素是相对于父元素的content进行的定位。不包括margin和padding。

<body>
	<div class="fa">
		<div class="so"></div>
	</div>
</body>
<style>
.fa{
			width: 100px;
			height: 100px;
			position: relative;
			background: yellow;
			padding: 20px;
			margin: 20px;
		}
		.so{
			width: 50px;
			height: 50px;
			position: absolute;
			background: red;
		}
</style>