20190502/cssMargin1.html

<!doctype html> <!-- cssMargin1.html -->
<html>
  <head>
    <meta charset="utf-8"/>
		<meta name="viewport" content="width=device-width, initial-scale=1"/>
    <title>CSS margin 실습</title>
    <style>
			*{box-sizing:border-box; padding:0; margin:0; border:1px solid blue;}
			.pm1 {margin:50px 50px 50px 50px; border:2px solid blue; width:50%;
			background-color:beige;}
			.pm2 {margin:100px 100px 100px 100px 100px; border:2px solid blue; width:50%;
			background-color:beige;}
    </style>
  </head>
  <body>
		<section>
		<h3>애국가</h3>
			<p class="pm1">동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라 만세. 무궁화 삼천리 화려강산 대한 사람, 대한으로 길이 보전하세. 남산 위에 저 소나무, 철갑을 두른 듯 바람서리  불변함은 우리 기상일세. 무궁화 삼천리 화려강산 대한 사람, 대한으로 길이 보전하세. 가을 하늘 공활한데 높고 구름 없이 밝은 달은 우리 가슴 일편단심일세. 무궁화 삼천리 화려강산 대한 사람, 대한으로 길이 보전하세.이 기상과 이 맘으로 충성을 다하여 괴로우나 즐거우나 나라 사랑하세. 무궁화 삼천리 화려강산 대한 사람, 대한으로 길이 보전하세.</p>
			<p class="pm2">동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라 만세. 무궁화 삼천리 화려강산 대한 사람, 대한으로 길이 보전하세. 남산 위에 저 소나무, 철갑을 두른 듯 바람서리  불변함은 우리 기상일세. 무궁화 삼천리 화려강산 대한 사람, 대한으로 길이 보전하세. 가을 하늘 공활한데 높고 구름 없이 밝은 달은 우리 가슴 일편단심일세. 무궁화 삼천리 화려강산 대한 사람, 대한으로 길이 보전하세.이 기상과 이 맘으로 충성을 다하여 괴로우나 즐거우나 나라 사랑하세. 무궁화 삼천리 화려강산 대한 사람, 대한으로 길이 보전하세.</p>
		</section>
  </body>
</html>