[CSS 예제] border, padding, margin, font.. :: 소림사의 홍반장!

[CSS 예제] border, padding, margin, font..

2012. 9. 12. 22:35 - 삘쏘굿
실행 소스

<?xml version="1.0" encoding="EUC-KR" ?>

<!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=EUC-KR" />

<title>CSS 1</title>

<style type="text/css">

 

/* CSS에서 유일한 주석 - CSS에서는 이것 하나만 쓸 수 있음

selector(선택자) {

        선언부

}

 

 

*/

div {

        /* border : 3가지 (선스타일, 선굵기, 선색깔) 순서없이 */

        border: thin solid black;

        padding: 100px; /* px : pixel 픽셀 */

        margin: 100px 50px 150px 50px;           /* 순서 : 위 오른쪽 아래 왼쪽 */

        /* 대부분 margin 끼리는 겹칠수 있다. 여백이 한번만 적용 */

        font-family:

}

 

body {

        /*     color: yellow;       -      색이름지정 */

        color: #000000;      /* #RGB 컬러 지정 : 빛의 3원색 적용 */

}

 

p {

        border: inherit;   

        /* border는 상속되지 않는 속성이기 때문에 inherit 값을 통해

        강제로 상속받는 것이 가능하다.

        (padding, margin, width, height 마찬가지) */

        font-family: '궁서', dotum;

}

 

 

</style>

</head>

<body>

        <div>

               <p>p태그</p>

               몽골용단의 말춤 기대됨~!

        </div>

        <div>

               저녁은 뭘 먹지??

        </div>

</body>

</html>

 



실행 결과

p태그

몽골용단의 말춤 기대됨~!
저녁은 뭘 먹지??

다른 카테고리의 글 목록

Dev. 웹/CSS 카테고리의 포스트를 톺아봅니다