最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
css父元素与子元素之间的margin-top问题
时间:2022-06-25 11:14:11 编辑:袖梨 来源:一聚教程网
父元素的盒子包含一个子元素盒子,给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值,而子元素和父元素的边距则没有发生变化。
html代码:
css样式:
.box1{background:gray;}
.box2{background:gold;margin-top:50px;}
解决方法:
1、修改父元素的高度,增加padding-top样式模拟(padding-top:1px;常用)
2、为父元素添加overflow:hidden;样式即可(完美)
3、为父元素或者子元素声明浮动(float:left;可用)
4、为父元素添加border(border:1px solid transparent可用)
5、为父元素或者子元素声明绝对定位
在某些浏览器中,当给层内元素设置margin-top时,层内元素并没有margin,而是父层出现了margin-top,这往往让人很费解吧。。
解决办法有:
1.给父层添加:overflow:hidden;
2.给父层添加:border除none以外的属性
3.给父层添加:padding-top代替margin-top的效果。
相关文章
- 碧蓝航线的里雅斯特期待的便当时间皮肤有什么 04-30
- 明日之后踏浪逐星服装展示攻略 04-30
- 深空之眼幽月塞勒涅刻印搭配核心思路 04-30
- 明日之后红杉茶会护卫队首领BOSS有哪些 04-30
- CF手游段位奖励汇总攻略 04-30
- 无期迷途5-13怎么走攻略 04-30