margin-top 예제
<style> div { border:1px solid blue;} h1 { border:1px solid red; margin-top:200px;} p { border:1px solid green;} </style> <div> <h1>margin-top : 상단 여백</h1> <p>홈짱닷컴 Homzzang.com</p> </div> 결과 보기
<style>
div { border:1px solid blue;}
h1 { border:1px solid red; margin-top:200px;}
p { border:1px solid green;}
</style>
<div>
<h1>margin-top : 상단 여백</h1>
<p>홈짱닷컴 Homzzang.com</p>
</div>
결과 보기
※ 주의요소 자체의 브라우저 margin 내장값에 의해 h1 과 p 요소 사이에 여백이 있음.
→ h1과 p 사이의 여백 제거하려면, h1 요소에 margin-bottom:0 , p 요소에 margin-top:0줘야함.