<style> p { line-height: 200%;
padding: 30px;
border: solid 2px pink;
border-radius: 20px;
} </style> <body> <p>웹 페이지에 있는 모든 HTML 요소는 사각형 형태를 가지는 박스로 생각할 수 있다.
CSS에서는 이러한 박스를 기반으로 하여 요소에 경계선을 그릴 수 있다.</p> </body>
ex2-9.html의 실행 결과
다음 예제를 통하여 박스의 모서리를 둥글게 만드는 방법에 대해 공부합니다.
박스 그림자
ex2-10.html
<style> div { width: 500px;
border: solid 1px skyblue;
padding: 20px;
box-shadow: 5px 5px 10px #888888;
} </style> <body> <div> <h3>박스 모델</h3> <p>웹 페이지에 있는 모든 HTML 요소는 사각형 형태를 가지는 박스로 생각할 수 있다.
CSS에서는 이러한 박스를 기반으로 하여 요소에 경계선을 그릴 수 있다.</p> </div> </body>