관리 메뉴

맛집 여행 캠핑 일상 생활

HTML/CSS IE 7, 8 @media screen 안먹는 문제 본문

HTML.CSS

HTML/CSS IE 7, 8 @media screen 안먹는 문제

♥ 영은파더♥ 2016. 12. 13. 15:04

HTML/CSS IE 7, 8 @media screen 안먹는 문제



익스플로러 8버전 이하에서는 @media screen 이 먹히지가 않습니다.


https://github.com/heathcliff/css3-mediaqueries-js 여기에 가면 ie8 이하에서도 동작하도록 자바스크립트로 만들어진 파일을 다운로드 받을 수 있습니다.


https://github.com/heathcliff/css3-mediaqueries-js/blob/master/css3-mediaqueries.js


긁어서 css3-mediaqueries.js 파일로 저장을 하면 됩니다.



사용예제


<!doctype html>

<html>

<head>

<!--[if lt IE 9]>

<script src="/js/css3-mediaqueries.js"></script>

<![endif]-->

<style>

.div_test {

width:100%;

height:500px;

background:white;

}

@media screen and (max-width: 1280px) {

.div_test {

background:yellow;

}

}

@media screen and (max-width: 1024px) {

.div_test {

background:blue;

}

}

@media screen and (max-width: 640px) {

.div_test {

background:red;

}

}

@media screen and (max-width: 360px) {

.div_test {

background:green;

}

}

</style>

</head>

<body>

<div class="div_test"></div>

</body>

</html>


Trackback : 0 | Comments : 0
댓글쓰기 폼