css嵌套关系外边距注意事项

最新推荐文章于 2022-04-29 23:26:24 发布

Stirve unremitting

最新推荐文章于 2022-04-29 23:26:24 发布

阅读量245

点赞数

分类专栏：笔记文章标签： css

本文链接：https://blog.csdn.net/weixin_46421045/article/details/104652134

版权

笔记专栏收录该内容

96 篇文章

订阅专栏

在这里插入代码片<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			*{margin: 0px;height: 0px;}
			#wai{width: 200px;height: 200px;background: pink ;/*padding-top:50px ;*/float: left;}
			#wai .nei{width: 50px;height: 50px;background: green;/*margin-left: 100px;*/float: left;}
			p{ width :200px;height:260px;/*margin-top: 96px;*/background: skyblue;float: left;}
		</style>
	</head>
	<body>
		<div id="wai">
			<div class="nei"></div>
		</div>	
			<p>在设置内外边距的时候要注意：
				1、父子嵌套关系的情况下，只有设置子元素margin-top的时候会影响父元素一同向下，其余的属性不会影响父级。（可以给父级元素设置padding-top这样就可以实现子元素的向下移动）
				2、在给父级设置padding-top的px值后要在父元素的高度height减去相应的数值。
			</p>
			
		</div>
	</body>
</html>