解决：子元素设置margin-top，父元素也受影响的问题

2023-01-27 07:47:39

<!doctype html>
<html>

<head>

<meta charset="UTF-8">
<title>子元素设置margin-top，父元素也受影响</title>
</head>
<style type="text/css">
* {
margin: 0px;
padding: 0px;
}
.father {
width: 500px;
height: 800px;
background: #ccc;
cursor: pointer;
/*第一种padding-top: 1px;常用*/
/*第二种border: 1px solid red(transparent);可用*/
/*第三种父元素设置overflow: hidden;*/
}
.son {
width: 450px;
height: 600px;
margin-top: 200px;
}
</style>

<body>
<div class="father">
<div class="son">
<img src="7v/1318240446520.jpg"/>
</div>

</div>

</body>

</html>