简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
집 > 웹 프론트엔드 > HTML 튜토리얼 > 본문

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

WBOY
풀어 주다： 2016-06-24 12:14:16
원래의
925명이 탐색했습니다.

<!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>
로그인 후 복사

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


回复讨论(解决方案)

用相对定位

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

外层没设border就重叠了。

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

用pading-top

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

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

관련 라벨：
奇怪的margin-top问题
원천：php.cn
이전 기사：用html怎样设置背景图片？_html/css_WEB-ITnose 다음 기사：这是什么意思_html/css_WEB-ITnose
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
고정 위치의 자식이 부모의 패딩을 무시함 고정 요소가 헤더 뒤로 이동하는 것을 방지하는 방법은 무엇입니까? 현재 코드 조각은 상위 항목에 padding-top을 사용합니다. 또한 추가 하위 항목에 mar...
에서 2024-04-06 11:42:51
0
1
338
Nuxt 3는 SSR에서 렌더링되지 않습니다. 그래서 개인 환경 변수를 얻으려고 할 때 문제가 발생했습니다. 내 페이지가 ssr인 경우에만 얻을 수 있다는 것을 알고 있습니다. 문제는 내가 그것을 비활성화한 ...
에서 2024-04-05 15:04:40
0
1
3642
너비가 고정되고 최대 너비가 90%인 그리드 하위 항목이 그리드 트랙을 오버플로하는 이유는 무엇입니까? 질문: 제 질문은 매우 간단합니다. .header 요소가 뷰포트 너비 1500픽셀에 도달할 때 그리드 트랙을 오버플로하는 이유를 알고 싶습니다. 코드: *{box...
에서 2024-04-05 14:33:39
0
1
1426
CSS를 사용하여 Next.js의 Tic-Tac-Toe 보드에서 각 줄 아래의 공간을 제거하는 방법은 무엇입니까? 각 줄 아래에 공백이 있는 이유는 무엇입니까? (CSS) 저는 제 실력을 테스트하기 위해 Next.js tic-tac-toe 앱을 만들려고 합니다. 그러나 CSS...
에서 2024-04-05 11:39:02
0
1
1431
고정 헤더와 회전된 열 헤더가 있는 테이블 고정된 헤더와 고정된 첫 번째 열이 있는 테이블이 있습니다. 또한 열 머리글을 45도 회전하고 싶습니다. 고정 제목에는 배경색을 설정해야 합니다. 그러나 다음 열...
에서 2024-04-03 08:50:32
0
1
362
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！