首页 > web前端 > html教程 > 子元素增加margin-top会增加给父元素的问题_html/css_WEB-ITnose

子元素增加margin-top会增加给父元素的问题_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
发布: 2016-06-24 11:29:33
原创
1601 人浏览过

假设我们有如下代码

  


    

  

会发现效果如下所示

子元素的margin-top并没有使子元素与父元素分开,反倒效果等同于给父元素加了一个margin-top;

解决的方法也有,具体为:

1.修改父元素的高度,增加padding-top样式模拟(padding-top:1px;)

2.为父元素添加overflow:hidden;

3.为父元素或者子元素生命元素浮动(float:left;可用但是不推荐)

4.为父元素添加border(border:1px solid transparent)

5.为父元素或者子元素声明绝对定位

6.给父元素增加内容生成#father:before{content:' ';display:table};

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
如何设置 flex:auto 元素的子列表的宽度
来自于 1970-01-01 08:00:00
0
0
0
javascript - insertbefore的替换父元素的问题
来自于 1970-01-01 08:00:00
0
0
0
​老师 我有一个问题,就是display:block,
来自于 1970-01-01 08:00:00
0
0
0
为什么从 width: 100% 过渡会导致过渡跳跃?
来自于 1970-01-01 08:00:00
0
0
0
重新运行useEffect:提交函数后的操作指南
来自于 1970-01-01 08:00:00
0
0
0
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板