div设置浮动之后整个div向下移动了一些。为什么?
这是啥
这是啥 2017-03-23 17:56:04
0
2
1720
#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之后,感觉整个位置向下移动了一点距离。

这是啥
这是啥

全部回复 (2)
数据分析师

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都不会动,你可以试试。

      最新下载
      更多>
      网站特效
      网站源码
      网站素材
      前端模板
      关于我们 免责声明 Sitemap
      PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!