캔 2 CSS 미디어 쿼리 정의 중복

내가 다른 vieqport 또는 장치 폭에 대해 여러 CSS 미디어 쿼리를 정의하고 ...캔 2 CSS 미디어 쿼리 정의 중복

그래서 제 질문은 CSS 미디어 쿼리 정의 블록이 겹칠 수 2 만 1 일치가 적용됩니다이다. 어떻게 작동합니까?

여러 장치에 적용 할 올바른 방법은 무엇입니까? 정의의 순서는 무엇입니까?

출처

2011-09-18 testndtv

쉼표로 구분 된 목록으로 여러 미디어 쿼리를 결합 할 수 있습니다. 목록의 미디어 쿼리 중 하나라도 true이면 연결된 스타일 시트가 적용됩니다. 이는 논리적 "또는"연산과 같습니다.

https://developer.mozilla.org/en/CSS/Media_queries

그래서

이것은 논리의 상당 "또는"

그것은 단지 하나의 일치가 적용되는 것처럼 보이게하는 작업입니다.

http://reference.sitepoint.com/css/mediaqueries도이를 확인하는 것으로 보입니다.

사실이라면 (나와 테스트되지 않은 경우) 어떤 미디어 쿼리와 일치하는 모든 공통 스타일을 제공하고 각 대상 장치에 대한 추가 스타일이 포함 된 장치 독립 스타일 시트가있는 공통 스타일 시트를 만들 것입니다. .

출처

2011-09-18 17:29:46

Thx 많이 ..하지만 내 질문에 다른 맥스 너비에 대한 내 CSS에 여러 @ 미디어 문장이 있다면, 거기에 어떤 가능성이 이러한 블록 중 2가 적용됩니다 또는 단지 1 적용됩니다 .. pls 어떤 제공합니다 예 ... – testndtv

내가 제공 한 문서에 따르면 하나만 적용 할 수 있습니다. 하지만 안된다. –

누구든지 지금이 대답을 왜곡 한 이유는 무엇입니까? 나는 그것을 보증한다고해도 싫어하지만 나는 왜 그런지 알고 싶다. 나는 앞으로도 똑같은 실수를하고 싶지 않다. –

이상합니다. 작성하는 경우 :

<link media="screen and (max-width: 1250px)" href="/css/small.css" type="text/css" rel="stylesheet" /> 
<link media="screen and (max-height: 850px)" href="/css/small.css" type="text/css" rel="stylesheet" />

이 코드는 XOR (2 개의 스타일 시트 사용)처럼 작동합니다. 두 조건 (폭 < 1250 및 높이 < 850)이 충족되면 스타일 시트가 적용되지 않습니다. 하지만 쓸 경우 :

<link media="screen and (max-width: 1250px), screen and (max-height: 850px)" href="/css/small.css" type="text/css" rel="stylesheet" />

잘 작동합니다. 그래서 쉼표는 모든 것에 대한 해결책입니다.

출처

2012-02-10 15:09:11

캔 2 CSS 미디어 쿼리 정의 중복

답변

관련 문제