반응형 웹사이트 제작을 위한 head태그에 삽입하는 준비물
- Nest
- Development
- Category
- html/css
- Hit
- 585
- Star
- 0
jQuery 2.0을 분기로 로드하고, ie8이하의 환경일때 데스크탑 레이아웃으로 출력.
css browser selector를 사용하여 css코딩에서 환경별로 분리할 수 있다.
head태그에 들어가는 내용
<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, width=device-width">
<link rel="stylesheet" href="default_mobile.css" type="text/css" media="screen, handheld" />
<link rel="stylesheet" href="default_tablet.css" type="text/css" media="only all and (min-width:768px)" />
<link rel="stylesheet" href="default_desktop.css" type="text/css" media="only all and (min-width:1024px)" />
<!--[if lt IE 9]>
<link rel="stylesheet" href="default_tablet.css" type="text/css" media="screen" />
<link rel="stylesheet" href="default_desktop.css" type="text/css" media="screen" />
<![endif]-->
<!--[if lt IE 9]>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<![endif]-->
<!--[if gte IE 9]><!-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<!--<![endif]-->
<script type="text/javascript" src="css_browser_selector.min.js"></script>