顶部不工作让黄色框失望？
这个问题在这里已经有了答案：
发生这种情况是由于margin collapsing -这样一个border ， padding到父元素或inline内容（任何inline元素）将关掉余量塌陷。
参见下面的演示：
.largebox {
width: 800px;
height: 350px;
background-color: #00f;
margin-left: 10px;
border: 1px solid; /*ADDED THIS*/
}
.box1 {
width: 250px;
height: 300px;
background-color: #ff0;
margin-left: 50px;
margin-top: 25px;
}<div class="largebox">
<div class="box1"></div>
</div> 使用display:inline-block; 在box1
.largebox {
width: 800px;
height: 350px;
background-color: #00f;
//padding-left: 50px;
margin-left: 10px;
//border: 2px solid black;
}
.box1 {
width: 250px;
height: 300px;
background-color: #ff0;
//display: inline;
//float: left;
//margin-right: 0px;
margin-left: 50px;
margin-top: 25px;
display:inline-block;
}
<div class="largebox">
<div class="box1"></div>
</div> 你可以尝试使用position:absolute; 在.box1是这样的：
.box1{
position:absolute;
}