zoukankan      html  css  js  c++  java
  • 清除浮动的几种方法

    什么时候用清除浮动:

    父级没高度,子盒子浮动,影响到了下面布局,我们就应该清除浮动了。

    清除浮动主要为了解决父级元素因为子级浮动引起内部高度为0的问题。清除浮动之后,父级就会根据浮动的子盒子自动检测高度。父级有了高度,就不会影响下面的标准流了。

    清除浮动的方法:

    ①额外标签法(隔墙法)

    通过在浮动元素末尾添加一个空的标签:

    <div style=”clear:both”></div>

    ②父级添加overflow属性方法

    给父级添加:overflow为 hidden | auto | scroll 都可以实现。

    ③使用after伪元素清除浮动

    .clearfix:after {
    	content: "";
    	visibility: hidden;
    	display: block;
    	clear: both;
    	height: 0;
    }
    .clearfix {
    	*zoom: 1; /* IE6、7 专有 */
    }
    

    ④使用双伪元素清除浮动

    .clearfix:before,
    .clearfix:after {
    	content: "";
    	display: table;
    }
    .clearfix:after {
    	clear: both;
    }
    .clearfix {
    	*zoom: 1; /* 由于IE6-7不支持:after,使用zoom: 1触发hasLayout */
    }
    
  • 相关阅读:
    再谈树形dp
    洛谷 P3627 [APIO2009]抢掠计划
    树状数组
    树形dp 入门
    洛谷P2014 选课
    洛谷P2015 二叉苹果树
    9 vue.js 被观察数组的变异方法
    8 vue的v-model指令学习
    7vue-事件修饰符
    6.vue事件绑定-click
  • 原文地址:https://www.cnblogs.com/kawayi/p/14425626.html
Copyright © 2011-2022 走看看