부트 스트랩에서 세로보기 사용 안 함

내 웹 사이트는 태블릿 (iPad 등)의 가로보기에서는 괜찮지만 세로보기에서는 괜찮습니다.부트 스트랩에서 세로보기 사용 안 함

부트 스트랩에서 태블릿의 세로보기를 사용 중지하는 방법이 있습니까? 따라서 태블릿이 회전하면보기가 회전하지 않습니다.

이것이 네이티브 모바일 응용 프로그램에서 수행 할 수 있다고 생각합니다. 따라서 CSS/js 등을 사용하여 웹에서 가능합니까?

감사합니다.

출처

2014-09-10 brainHax

그래서, 뭐? 사용자는 세로 모드 장치에서 가로 모드 웹 페이지를 사용하기 위해 목을 크레인해야합니다. 좋은 해결책은 아닙니다. 웹 사이트를 세로 모드로 작동시키는 방법을 묻는 것이 좋습니다. –

[iPad에서 세로 모드를 웹 앱으로 사용 중지] (http://stackoverflow.com/questions/11520980/disable-portrait-mode-on-ipad-to-web-app) –

예 가능한 세로의 사용을 중지합니다. 모드. 언급 된 중복 질문은 부트 스트랩과 관련이 없습니다. 나는 기본적으로 부트 스트랩이 제공하는 것을보기를 희망했다. – brainHax

부트 스트랩은 CSS와 자바 스크립트입니다. 웹 사이트를 세로보기 대신 작동하지 않도록 설정하는 것이 가장 좋은 솔루션입니다. 부트 스트랩에서 제공하는 것을 찾고 있다면 부트 스트랩의 그리드 시스템을 기반으로 이러한 미디어 쿼리를 사용하여 많은 작업을 수행 할 수 있습니다.

/* Large desktops and laptops */ 
@media (min-width: 1200px) { 

} 

/* Portrait tablets and medium desktops */ 
@media (min-width: 992px) and (max-width: 1199px) { 

} 

/* Portrait tablets and small desktops */ 
@media (min-width: 768px) and (max-width: 991px) { 

} 

/* Landscape phones and portrait tablets */ 
@media (max-width: 767px) { 

} 

/* Landscape phones and smaller */ 
@media (max-width: 480px) { 

}

어떤 이유에서 세로보기를 사용 중지했는지 알 수 없지만 실제로 작동하게 만들 수는 있습니다. 미디어 쿼리 괄호 안에 적용된 모든 CSS는 주어진 스크린 크기에만 적용됩니다.

출처

2014-09-10 09:17:50 Tim

큰 감사 :), 나는 사이트가 세로보기에서 엉망으로 보였으므로 일시적으로 사용하지 못하게하고 싶었습니다. 나는 당신의 제안을 시험 할 것이다. 감사 – brainHax

Boostrap의 작은 화면에서 풍경을 강제 적용합니다. 소스 http://scala9simo.blogspot.com.ar/2015/04/trying-to-force-landscape-mode-on.html

/* In CSS file */ 
@media (max-device-width: 480px) and (orientation: portrait) { 
    .landscape-in-phone { 
     display:block; 
     -webkit-transform: rotate(90deg); 
     -moz-transform: rotate(90deg); 
     -o-transform: rotate(90deg); 
     -ms-transform: rotate(90deg); 
     transform: rotate(90deg); 
     min-width:460px; 
    } 
}

<!--In HTML file --> 
<!--Page main container --> 
<div class="landscape-in-phone">  
    <!--All body content here -->  
</div>

출처

2015-06-24 00:28:32

부트 스트랩에서 세로보기 사용 안 함

답변

관련 문제