4

대개의 경우 내 스타일 시트가 올바르게 표시됩니다. 표준/원래는 항상 그러나 그것은 모바일 장치에서 본 때 때때로 이동 하나가 무시되는 것, 완벽하게 작동모바일 용 CSS가 때때로 원래 모양으로 돌아갑니다.

나는 다음과 같이 그들을 지정이 :

<link href="CustomStyleSheets/standard.css" rel="stylesheet" type="text/css" /> 
<link href="CustomStyleSheets/mobile.css" rel="stylesheet" type="text/css" media="only screen and (max-device-width: 799px)" /> 

나는 드로이드 X를 사용하고 있습니다 페이지를 보려면 세로 모드에서 위의 지정된 최대 너비를 초과해서는 안되지만 때로는 임의로 원래 CSS 페이지로 되돌아갑니다.

그렇게하지 않으려면 어떻게해야하나요?

+0

안드로이드 브라우저의 버그가 될 수이 아이폰이나 오페라에서 발생 않습니다 또한

는 페이지가 장치 치수에 정확하게 조정되고 있는지 확인하기 위해이 메타 태그를 포함하는 것을 잊지 마세요 android – nLL

+0

내가 올바르게 기억한다면 아이폰에서도 발생하지만, 오늘 아침 우리 매킨토시에 문제가있어 에뮬레이터에서 아직 테스트 할 수 없었다 ... 내 부서에 아무도 테스트 할 수 없었다. 아이폰을 소유하고있다. –

+0

'max-width : 799px'를 사용할 때도 같은 결과가 발생합니까? – Hannes

답변

-1

아마도 standard.css에 media = "screen"을 사용 하시겠습니까? 아마 (도움 :..

또는 서버 측에서 사용자 에이전트를 확인에만 모바일 CSS를, 그렇지 않으면 부하 standard.css

나는 그것이 모바일 기기인지 알아 WURFL를 사용하는 모바일 장치의 부하 인 경우 .. .

0

나는 그것을 변경하기 된 본문 요소의 크기였다 믿는 올바른 doctype이 중요 그것은해야 그 전에 일을 참조했습니다...

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> 
+0

실제로 WAP docType은 Blackberry와 같은 일부 장치에 완벽하게 유효하지만 iPhone/Android에서는 필요하지 않습니다. HTML5 doctype과 완벽하게 작동합니다. 예 :

0

용지 종류를 사용해보십시오 "핸드 헬드"

<link href="CustomStyleSheets/standard.css" rel="stylesheet" type="text/css" /> 
<link href="CustomStyleSheets/mobile.css" rel="stylesheet" type="text/css" media="handheld" /> 
+1

주의해야 할 사항 : iPhone에서주의해야 할 사항 핸드 헬드 형 미디어를 지원하지 않기 때문에 적어도 iPhone에서는 원하는 효과를 얻을 수 없습니다. 더 많은 정보는 여기에 있습니다 : http://stackoverflow.com/questions/3893342/do-iphone-android-browsers-support-css-media-handheld –

+0

@ 짐 - 당신 말이 맞아요. 대부분의 최신 터치 스크린 장치는 핸드 헬드를 지원하지 않습니다. –

2

standard.css가 mobile.css에 표시되는 캐스케이드에 영향을 미치지 않는지 확인하십시오. 휴대 기기가 먼저 표준 CSS를로드 한 다음 mobile.css를로드하는 것처럼 보입니다. 따라서 두 스타일 시트의 스타일이 디스플레이에 영향을줍니다. 일반적으로 모바일 스타일 시트를 모바일 장치에만 표시하는 논리로 내 스타일 시트 링크 요소를 래핑합니다. 동시에 두 스타일 시트가 아닙니다. ,

<meta name="viewport" content="width=device-width" /> 
+0

_ 대개 내 스타일 시트 링크 요소를 모바일 스타일 시트 만 모바일 장치에 표시하는 로직으로 래핑합니다 .- 동시에 두 스타일 시트가 아닙니다 ._ <- 자세히 설명해주십시오. 어떻게 그들을 논리로 포장합니까? 자바 스크립트 같은 것을 사용하고 있습니까? –

+0

제 생각에는 그가 첫 번째 CSS 가져 오기에 조건을 추가하여로드되지 않도록한다는 것입니다. 미디어의 성격 = "모두 (최소 너비 : 800)"은 브라우저가 충돌하는 데스크톱 버전의 "모바일 버전"을로드하는 것을 방지합니다. – N0Alias

관련 문제