margin의 속성
마진(margin).....이란..?
설명하자면 여백을 조절하는 속성이라고 할 까요?
이건 예제를 보면서 익히면 금방 이해하실 수 있을 겁니다.
예제를 보기 전에 참고적으로 , margin속성의 수치단위는 px , pt , in ,cm를 사용할 수 있고요... 마이너스(-)값도 사용할 수 있습니다.
퍼센트 값을 사용할 수 도 있는데 그러면 브라우져에 따라 유동적이기 때문에 원래 원하던 표현이 안될 수도 있답니다. margin 속성은 잘 만 사용하면 정말 멋진 웹페이지를 만들 수 있답니다. 이제 예제를 볼까요?
<style type="text/css">
<!--
body { font-family: 돋움체; }
.love { font-size : 130px; color:red; font-weight:bold; margin-bottom:0px; }
.story { margin-top:-110px; margin-left:87px; margin-bottom:0px; font-size:30px; color: blue; }
.kiss { font-size:15px; margin-left:50px; margin-right:50px; text-align:justify; }
-->
</style>
<body>
<p class=love>오작교의 홈</p>
<p class=story>중년, 그 아름다운 삶이 있는 곳</p>
<p class=kiss>중년의 가슴들이 모여 있는 곳입니다. 사람들을 좋아하는 사람들의 공간입니다. 서로가 서로를 위하여 세월이 흘러가는 것을 자연스럽게 인정하면서 곱게 나이먹어 가는 아름다움을 느끼는 곳입니다. 그래서 우리 홈 공간은 아름다울 수 밖에 없습니다.</p>
</body>
설명하자면 여백을 조절하는 속성이라고 할 까요?
이건 예제를 보면서 익히면 금방 이해하실 수 있을 겁니다.
예제를 보기 전에 참고적으로 , margin속성의 수치단위는 px , pt , in ,cm를 사용할 수 있고요... 마이너스(-)값도 사용할 수 있습니다.
퍼센트 값을 사용할 수 도 있는데 그러면 브라우져에 따라 유동적이기 때문에 원래 원하던 표현이 안될 수도 있답니다. margin 속성은 잘 만 사용하면 정말 멋진 웹페이지를 만들 수 있답니다. 이제 예제를 볼까요?
<style type="text/css">
<!--
body { font-family: 돋움체; }
.love { font-size : 130px; color:red; font-weight:bold; margin-bottom:0px; }
.story { margin-top:-110px; margin-left:87px; margin-bottom:0px; font-size:30px; color: blue; }
.kiss { font-size:15px; margin-left:50px; margin-right:50px; text-align:justify; }
-->
</style>
<body>
<p class=love>오작교의 홈</p>
<p class=story>중년, 그 아름다운 삶이 있는 곳</p>
<p class=kiss>중년의 가슴들이 모여 있는 곳입니다. 사람들을 좋아하는 사람들의 공간입니다. 서로가 서로를 위하여 세월이 흘러가는 것을 자연스럽게 인정하면서 곱게 나이먹어 가는 아름다움을 느끼는 곳입니다. 그래서 우리 홈 공간은 아름다울 수 밖에 없습니다.</p>
</body>
신고
"님의 댓글"
이 댓글을 신고하시겠습니까?
