HTML-浮动与清除浮动

1.浮动:float:left;right;none

2.浮动的模块是没有高度,不占用位置的,如下:



如果给上面的div1和div2加上左浮动,则div3就会上移,出现如下所示效果:


为了让div1和div2占有它原来的位置,让div3显示在它们下面,则要清除浮动。

关于浮动的清除有以下几种:

1)clear  (clear:both;)

添加额外的标签(如:京东)


京东案例:


闭合浮动



给父盒子添加伪元素(如:新浪),效率比较高(尽管看着多出来很多代码)


zoom:1;        主要是用来解决IE6的问题(因为IE6是不认.clearfix:after的)


3.开发工具:WebStorm

4.传统的清除浮动的方式:

1)clear:both;          (子元素)

2)overflow:hidden;         (父元素)

3)现在常用:伪类、额外标签法

  • 4
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值