zoukankan      html  css  js  c++  java
  • CSS中越界问题的经典解决方案

    (1)如何解决父元素的第一个子元素的margin-top越界问题

    1)为父元素加border-top: 1px;——有副作用

    2)为父元素指定padding-top: 1px;——有副作用

    3)为父元素指定overflow:hidden;——有副作用

    4)为父元素添加前置内容生成——推荐使用:

    .parent:before {

       content: '  ';

       display: table;

      }  

    (2)如何解决所有的子元素浮动后父元素高度变为0,且影响后续元素

    1)为父元素指定overflow:hidden;——有副作用

    2)为父元素指定高度:height: xxx;——有局限性

    3)为父元素添加后置内容生成——推荐使用:

    .parent:after {

      content: '  ';

      display: table;

      clear: both;   

    }  

    content 属性与 :before 及 :after 伪元素配合使用,来插入生成内容。

    该属性用于定义元素之前或之后放置的生成内容。默认地,这往往是行内内容,不过该内容创建的框类型可以用属性 display 控制。

  • 相关阅读:
    NYOJ题目916胖子小的百宝袋
    NYOJ题目893十字架
    NYOJ题目874签到
    设计模式之Singleton
    Elo rating system 模拟
    JDBC之SqlHelper
    《Thinking in Java》十四章类型信息_习题解
    NYOJ题目842整除的尾数
    NYOJ题目840吃花生
    NYOJ题目839合并
  • 原文地址:https://www.cnblogs.com/onebox/p/5411470.html
Copyright © 2011-2022 走看看