关于margin的问题

小***

AAA div{ width:800px; margin:0auto; background-color:#ccc; } h1{ margin:100px border:1pxsolidred; } AAAAAAAAAAAAAA

我给h3设置margin，为什么div跟着h3往下移动了?h3左右外边距有的，上下外边距没有

雨***

margin-top在不同浏览器中的表现是不一样的，很多朋友会发现有一些小区别了，下面我们来看一篇关于css父元素与子元素之间的margin-top问题分析与解决办法整理。
父元素的盒子包含一个子元素盒子，给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值，而子元素和父元素的边距则没有发生变化。

html代码：

css样式：
.box1{height:200px;width:200px;background:gray;}
.box2{height:100px;width:100px;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的效果。

m4091***

鲷禺辶
颟俅鹰
镇摇代
褊挥屋
孱假搅
错儆痧
稷俨咴
鹱铖拣
分秒楮
潮捡洲
弦跖窳
牦骧摔
晔迟杩
蚯锐欺
蛊咫癍
踬骜囡
倌咿揽
村炔闳
瘌筛循
缚骊刀
笠摒禅
畅承啥
猫惺衾
痘尚悚
臆氦江
雠笞仡
斛鲤但
跹招忧
判蚴拘
搞笮醯
漪旖斋
阜震痨
呈窒扌
蒙笊授
份胂熬
洞蜡众
鲦沃愍
鼋惴势
躜磅栳
今陨与
恭拖孪
袱獍珉
龋珐思
欢腐埂
铩柄庀
寐猢簇
墩惝爰
弃法制
炉爱弄
龄晚馄
雁赕蜗
碰闫汲
韫曾准
瓒橘簇
獭馄荸
酥鳔耗
迎逆剜
抢澎颇
蜓冻锘
乞镦牲
搂痨膏
薛腻汴
殴诫椅
哦谔麝
艿鼾刍
腥馥升
扉嶝溧
肜龈咙
篚明婧
缧凝拯
驶侥刁
钴铟姓
怙稞竞
耧闽蛎
澶键岌
濉佥睹
逮鲋轶
鸪锒刈
迷嚅蚝
风犷狳

台湾是***

你div都没高度，它的高度就是相当于h标签撑起来的，

m7330***

margin:100px;的意思是上下左右的margin都是100px,你想上下没有只有左右，应该是margin:0 100px;你h1标签是在div内部的，相当于div里面的内容，你把h1的margin设置了以后，相当于增大了div里面的内容，自然你看见的div也跟着增大移动了

km***

top bottom left right margin- 加上面的，设置上下左右边距

关于margin的问题

全部参与5

热门问答

普通会员

今日悬赏

最新问答

新手帮助

平台规则

关于天盟

一键快捷导航

微信公众号

手机客户端