더북(TheBook)

3 전통적인 웹 사이트 레이아웃 구조 만들기

 

먼저 HTML 문서 안의 공간을 정의하는 <header>, <aside>, <section>, <footer> 태그를 사용하여 설계 도면 작업을 진행합니다. 앞에서 언급했듯이 <html><body> 태그는 기본적으로 marginpadding 속성을 갖고 있으므로 공백이 생깁니다. 따라서 margin: 0;padding: 0;을 적용하여 공백을 없앱니다.

예제 소스 Exercise/9장/2_float/index02.html

<body>
    <header></header>
    <aside id="left"></aside>
    <section></section>
    <aside id="right"></aside>
<footer></footer>
</body>
신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.