index.html 의 조건주석문

<!-- ie8 이하에서 html5 시멘틱 태그와,  css3 선택자 일부 지원 -->
<!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>         
    <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>  
<![endif]-->

style.css 의 기본선택자

@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption{display:block;}
*, header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption{margin:0; padding:0;}
body {font-family: '나눔고딕', 'Nanum Gothic', sans-serif;}
li { list-style:none; }
img { border:none; }
a { text-decoration:none; }

jquery의 라이브러리

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://code.jquery.com/jquery-2.1.0.min.js" ></script>

뷰포트

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">

미디어쿼리 사용

@media (max-width:480px) { /* 모바일용 */
body { background:#f00; }
}
@media (min-width:481px) and (max-width:800px) { /* 태블릿용 */
body { background:#0f0; }
}
@media (min-width:801px) { /* PC용 */
body { background:#00f; }
}