가 브라우저 창 크기에 따라 다른 CSS 스타일 시트를 적용 - 내가 최종 아무것도 찾을 수 없습니다

Question

나에게 당신은 너무 친절 것하십시오

도움 ...

나는 이것에 대해 이동하는 방법을 가장 정확히 파악 어려움을 겪고, Google의 새로운 알고리즘이 내 (검색 결과) 검색어에별로 도움이되지 않기 때문입니다.

My site은 유체 너비가 100 %이므로 사용자 1152/1024 이하에서 스타일 시트를 변경해야합니다. 다음 jscript 조각을 사용하여 해상도를 감지하고 새로운 스타일 시트를 적용하기 시작했지만 IE에서는 작동하지 않습니다.

실제 브라우저 창을 기반으로 한 스타일 시트가 가장 좋지만 내용의 최대 너비는 1280px이므로 최소화 된 창을 가진 큰 해상도는 영향을받지 않을 것이라는 점을 이해하며 사용자가 귀찮게 할 것입니다. 1024 이하의 해상도를 사용중인 경우 해당 창을 최소화하십시오.

여기에 머리에 배치 내 현재 코드입니다 :

<script type="text/JavaScript"> 
var screenwidth = screen.width; 
if (screen.width < 1280){ 
document.write('<link rel="stylesheet" href="/Assets/Templates/Common/Public/1024res.css" type="text/css" media="screen" />'); 
} 
</script> 

그래서, 내 질문은 : 1) 왜 IE에서이 일을하지 않는 이유는 무엇입니까? 그리고 2) 이것이 jscript가 비활성화 될 수 있다고 생각할 때 가장 좋은 경로입니까? 아무도 이것을 달성하는 가장 좋은 방법을 알고 있습니까?

도움이되었습니다.

Answer 1

자바 스크립트가 아닌 방법 :

<link rel="stylesheet" media="screen and (min-device-width: 1152px)" href="800.css" /> 

참조 : 주석에 대한 http://css-tricks.com/resolution-specific-stylesheets/