首页 > 其他 > 详细

float---浮动带来的影响与清除浮动带来的影响方法----在路上(20)

时间:2016-12-31 16:58:27      阅读:272      评论:0      收藏:0      [点我收藏+]

使用float会带来哪些影响:

  • 脱标:无行级块级之分;
  • 相互贴靠:若想之间有空隙可用margin与padding;
  • 顶边对齐;
  • 文字环绕;

当使用float后,子标签脱离父标签,父标签就会失去高度,此时光标上移,父标签下面的内容就会上升,影响布局,因此:

如何清除浮动带来的影响:

  • 设高法;给父标签设置高度;
  • clear:both;给不想受影响的标签设置;
  • overflow:hidden;内墙法,隐藏超出部分,谁想浮动就给自己加一个overflow;
  • clearfix;before 与after;

  这里注意:在内墙法中,如想给子标签与父标签之间有距离,就子标签中设置margin,父标签中设置overflow:hidden;

 clear fix中应有的内容:

content:“”;
display:block;

clear:both;

height:0;
visibility:hidden;
*zoom‘1:为了兼容IE6、7

 

float---浮动带来的影响与清除浮动带来的影响方法----在路上(20)

原文:http://www.cnblogs.com/gengaiwei/p/6239389.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!