<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>HTML5 문서 구조 시맨틱 태그(Semantic Tag) 사용</title> <style> html, body { margin: 0; padding: 0; height: 100%; } .header { width: 100%; height: 15%; background-color: yellow; } .nav { width: 15%; height: 70%; float: left; background-color: orange; } .section { width: 70%; height: 70%; float: left; background-color: olivedrab; } .aside { width: 15%; height: 70%; float: right; background-color: orange; } .footer { width: 100%; height: 15%; clear: both; background-color: plum; } </style> </head> <body> <header class="header">Market</header> <nav class="nav"> 메뉴 <ul> <li><a href="siteSearch.html"> 딸기 마카롱 </a> </li> <li><a href="siteSearch2.html"> 초코 마카롱 </a> </li> </ul> </nav> <aside class="aside">aside</aside> <section class="section">section</section> <footer class="footer" align="center"> <address> 서울광역시<br> 관리자 이메일 : test@abc.com<br> 전화번호 : 000-000-0000 © All Right Reserved </address> </footer> </body> </html>
