반응형
삼성 갤럭시S2에 반응 없는 웹사이트
워드프레스 웹사이트 (제네시스 프레임워크 사용) 아이폰과 HTC에서는 제대로 반응하는 디스플레이를 설계했지만 삼성 갤럭시 폰에서는 그렇지 않습니다.(Samsung Galaxy S2 및 Samsung Ace에서 테스트됨) 저는 현재 FitVids 플러그인을 사용하여 비디오 내장물이 반응하도록 만들고 있습니다.
이상하게도 삼성폰에서 동영상 내장자가 없는 페이지는 정상적으로 표시되지만 동영상 내장자가 있는 페이지에서는 화면이 표시되는 페이지 레이아웃은 태블릿 화면이고 전화 화면은 표시되지 않습니다.
여러 가지 다른 플러그인을 시도해 보았지만 어느 플러그인도 이 문제를 해결하지 못하는 것 같습니다.
누군가가 이것에 대해 조언을 해준다면 좋을 것 같습니다.
여기 내 사이트입니다.
여기 CSS 스타일시트가 있습니다.
삼성 스크린이 480*800px인 것을 발견하였습니다.
아래 CSS를 사용해 보십시오.
@media only screen
and (min-device-width : 480px)
and (max-device-width : 800px)
and (orientation : landscape) {
}
@media only screen
and (min-device-width : 480px)
and (max-device-width : 800px)
and (orientation : portrait) {
}
감사해요.
이거 써보세요.
<meta content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" name="viewport">
@media 규칙을 사용하는 것은 권장되지 않습니다. 모바일 장치와 데스크톱의 픽셀 크기가 다를 수 있기 때문입니다.
예를 들어, 다음 대신:
@media only screen
and (min-device-width : 480px)
and (max-device-width : 800px)
and (orientation : landscape) {
}
@media only screen
and (min-device-width : 480px)
and (max-device-width : 800px)
and (orientation : portrait) {
}
왼쪽 여백이 5%이고 오른쪽 여백이 5%인 용기를 추가합니다.
<body>
<div class="container">
# Your body goes here
</div>
</body>
저는 이것이 표준 @media 규칙보다 훨씬 더 사용자 친화적이고 반응형 디자인에 대한 유지된 접근 방식임을 알게 되었습니다.
언급URL : https://stackoverflow.com/questions/17517930/website-not-responsive-on-samsung-galaxy-s2
반응형
'programing' 카테고리의 다른 글
| 패키지에서 node_modules에 대한 경로를 지정합니다.json (0) | 2023.10.20 |
|---|---|
| pandas 데이터프레임 열 유형을 문자열 또는 범주형으로 변환 (0) | 2023.10.20 |
| Spark DataFrame을 피벗하는 방법은? (0) | 2023.10.20 |
| NaN 타입 플로트로 빈 팬더 DataFrame을 만드는 우아한 방법 (0) | 2023.10.20 |
| 안드로이드는 거의 실시간 푸시 알림을 지원합니까? (0) | 2023.10.20 |