#test1{
height: 80px;
width: 80px;
background-color: black;
color:white;
padding:5px;
border:10px solid;
border-top-color: red;
border-right-color: green;
border-bottom-color: blue;
border-left-color: yellow;
margin:10px;
line-height: 80px;
text-align: center;
/* float: left; */这个div我添加了float:left之后，感觉整个位置向下移动了一点距离。
div設定浮動之後整個div向下移動了一些。為什麼？ -PHP中文網問答-div設定浮動之後整個div向下移動了一些。為什麼？ -PHP中文網問答
圍觀一下哦，學習一下。
这个问题主要的原因是你没有对body进行重置。chrom body元素默认情况下有margin为8px。而你设置了一个margin: 10px；在正常流中，margin会重叠。10px > 8px，所以取大的10px；但是当你对div添加了浮动之后，margin的算法就会变为叠加，因为float: left;会让div脱离当前的流。所以上面的margin变为18px；你就感觉div下降了。现在处理的办法是，你设置一个body{padding: 0; margin: 0;} 这样你添不添加floatdiv都不会动，你可以试试。