화면 해상도에 대한 조건문?

나는에 대해 서로 다른 스타일 시트를 부착하는 조건문을 사용하고 싶습니다 :화면 해상도에 대한 조건문?

if the clients resolution is <= 1024*768

나는이 가능하다 확신 해요,하지만 그것을 전에 대한 코드를 본 적이 없다?

PS. 나는 자바 스크립트 솔루션을 찾고 있지 않다.

2010-07-07 Haroldo

CSS 3은 media queries을 소개하지만, 새로운 것이고 아직 지원이 광범위하지는 않다. (파이어 폭스는 버전 3.5에서만이를 도입했으며, Internet Explorer는 그 때까지 그것을 얻지 못할 것이다. 버전 9)이므로 점진적 향상을 염두에 두십시오. CSS Tricks는 different CSS for different browser window sizes을 제공하는 자습서가 있습니다.

support for your browser을 테스트 할 수 있습니다.

<script type="text/javascript"> 

if (screen.height < 900) { 

document.write('<link href="UrLowRes.css" type="text/css" rel="stylesheet"/>'); 

} else { 

document.write('<link href="UrlHighRes.css" type="text/css" rel="stylesheet"/>'); 

} 

</script>

당신은 스마트 폰과 태블릿에 대한 다른 if 문을 추가 할 수 있습니다

출처

2010-07-07 12:26:13 Quentin

예, 1024 * 768과 오래된 브라우저 (css3 없음) 사이에는 강한 상관 관계가 있습니다. - 넷북이 늘어남에 따라 res-css correllation이 변경 될 수도 있습니다. – Haroldo

좁은 디스플레이 용으로 제작하고 미디어 쿼리를 사용하여 더 넓은 창을 탐지하고 레이아웃을 재정의하십시오. – Quentin

업데이트 : 2010 년 이후 많은 변화가있었습니다. CSS 미디어 쿼리는 현재 전 세계적으로 허용되고 있으며 모든 주요 브라우저에서 지원됩니다. –

이 옵션 완전히 클라이언트 측 자바 스크립트 스크립트 태그를 추가, 구동이있다.

출처

2012-10-20 01:47:59 frenchie

javascript가 아닌 해결책을 요구하고 있습니다. –

페이지로드 후 브라우저의 크기를 조정하고 해상도를 변경할 수 있으며 때마다 파일로드를 원하지 않기 때문에 사람들은 일반적으로 화면 해상도를 "다른 스타일 시트를 첨부"하지 않습니다. 때이 경우, @media 쿼리 조건에 해당하는 경우

/* css as usual */ 
.this-class { font-size: 12px; } 

/* condition for screen size minimum of 500px */ 
@media (min-width:500px) { 

    /* your conditional/responsive CSS inside this condition */ 

    .this-class { font-size: 20px; } 

}

이것은 20 픽셀 글꼴 크기를 변경해야합니다 :

예 :

이 하나 개의 CSS 파일에서 트릭을 할 것입니다 화면이 500px 이상입니다.

브라우저의 크기를 조정하면 조건부 CSS 규칙이 자동으로 적용되며 JS는 필요하지 않습니다.

출처

2014-05-31 04:10:34

좋은 답변, upvoted : D – ncomputers

화면 해상도에 대한 조건문?

답변

관련 문제