zoukankan      html  css  js  c++  java
  • 让父元素能感知浮动的子元素 #用伪元素清除浮动

    原理: 我们知道,普通元素及你父元素(“高度塌陷”)是无法感知到浮动元素的,而浮动元素是可以感知到它上面的元素的。

    我们如何让浮动元素后面的非浮动的兄弟感知到呢,我们知道需要给后面非浮动元素添加 clear: both;属性。

    也就是说如果我们给父元素前后都添加一个元素并且它们都感知到中间浮动的元素,那不就可以了(这两个子元素就像两个装置,分别位于元素的顶部与底部)。所以我们只需给父元素添加两个(before、after)伪元素,并设置为块元素(上下都独占一行,是不是更像装置了,哈哈)与 clear: both;即可。

    .y-clearfix:before, .y-clearfix:after {
                content: "";
                display: block;
                clear: both;
     }

    给父元素添加class="y-clearfix" 即可!

  • 相关阅读:
    人机界面设计
    可用性
    * 产品设计
    界面设计
    原型设计工具——Axure
    原型系统
    交互设计
    原型设计
    Microsoft-PetSop4.0(宠物商店)-数据库设计-Sql
    第1章 游戏之乐——NIM(2)“拈”游戏分析
  • 原文地址:https://www.cnblogs.com/zjazn/p/14023819.html
Copyright © 2011-2022 走看看