Heim > Web-Frontend > HTML-Tutorial > 奇怪的margin-top问题_html/css_WEB-ITnose

奇怪的margin-top问题_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 12:14:16
Original
964 Leute haben es durchsucht

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head><body><div style="height:419px;width:192px;background:url(images/1263871225.jpg)">  <div style="margin-top:100px">    </div></div></body></html>
Nach dem Login kopieren

这段代码在firefox或者ie8下面(其他浏览器没去试)都出现 内层div的margin-top撑开外层的现象
请教各位这是什么原因
附上图片


回复讨论(解决方案)

用相对定位

ie,firefox
定义的,body体的尺寸不一样啊。
你要先
body{
margin:0;
padding:0;
}

外层没设border就重叠了。

外层没设border就重叠了。
关键字:层嵌套的时候边距无效。

用pading-top

在父元素设置overflow:hidden;方可解决问题 还有问题发站内邮箱 明日帮你解决

谢谢d945332077这位老兄,我发现float:left也可以啊,这个问题困扰了我好久,我搞前端也有挺长一段时间了,自认为也挺熟悉的,可是这个问题让我彻底怀疑自己到底会不会div+css,呵呵

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage