子元素margin-top问题

来源：3-23 margin外边距属性

Ranbo2016

2018-01-21 13:29:44

老师好，为什么子元素可以设置margin-left没问题，但是效果是margin-top是他的父元素的外边距，这是老师的代码，

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>pdding和margin</title>
</head>
<style type="text/css">
    body,p{margin:0;}
/*.one{width:300px;height:300px;background-color: #acacac;padding-top:20px;padding-left:30px;padding-bottom:50px;padding-right: 40px;}*/
/*.one{width:300px;height:300px;background-color: #acacac;
     padding:20px 10px 5px 8px;}*/
/*.content{width:100%;height:100%;background-color: #ececec;}*/
/*.one{width:300px;height:300px;background-color: #acacac;
margin:10px 5px 8px 20px;}*/
/*.one{width:300px;height:300px;background-color: #acacac;
margin:auto;}*/
.content{width:100px;height:100px;background-color: #ececec;margin-left:100px;margin-top:100px;}
.one{width:300px;height:300px;background-color: #acacac;margin-bottom: 20px;}
</style>
<body>
<!-- <div class="one"><div class="content">padding属性</div></div> -->
<div class="one">
<div class="content">margin属性</div>
</div>

<!-- <p>123</p> -->
</body>
</html>

写回答

2回答