zoukankan      html  css  js  c++  java
  • 清除浮动

    清除浮动主要是为了解决父级元素因为子级浮动而引起的内部高度为0的情况。

    清除浮动的方法有很多种,这里我只写被大家推荐切常用的方法。

    1、父级添加伪类

    // html部分
    <div class='father'>
      <div class="left"></div>
      <div class="right"></div>
    </div>
    
    // css部分
    .father:after{
        display: block;
        content: '';
        clear: both;
    }
    .left{
         200px;
        heght: 100px;
        float: left;
    }
    .right{
         200px;
        heght: 100px;
        float: right;
    }

    2、父级添加overflow属性

    可以通过触发BFC的方式,可以实现清除浮动效果

    // html部分
    <div class='father'>
      <div class="left"></div>
      <div class="right"></div>
    </div>
    
    // css部分
    .father{
        overflow: hidden;
    }
    .left{
         200px;
        heght: 100px;
        float: left;
    }
    .right{
         200px;
        heght: 100px;
        float: right;
    }
  • 相关阅读:
    自定义函数
    内置函数
    炸裂函数explode
    -bash:ls:command not found,执行命令总是报找不到
    函数
    C#的lock用法
    获取客户端Ip地址方法
    Grunt基础
    常用Sql
    HandleBars
  • 原文地址:https://www.cnblogs.com/00feixi/p/11269410.html
Copyright © 2011-2022 走看看