HTML

[HTML] 모바일 웹 화면 강제 회전(가로모드 고정)

chsr 2020. 6. 8. 10:28
728x90
반응형

모바일 화면단 강제로 가로모드로 변환하기 (실제 가로모드로 변경했을 때의 화면단과 동일하게 보여짐)

<head>
	<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=yes">
    
    <!-- 화면이 너무 크게 보여질 경우 scale 값을 변경해주면 됨
    <meta name="viewport" content="width=device-width, initial-scale=0.8, minimum-scale=0.1, maximum-scale=0.75, user-scalable=yes">
    -->
</head>

<style>
  @media( orientation: portrait ){
    html {
      transform: rotate(-90deg);
      transform-origin: top left;
      position: absolute;
      top: 100%;
      left: 0;
      width: 100vh;
      height: 100vw;
    }
  }
</style>

 

 

켈로그 시리얼 디스펜서 레드 + 리얼그래놀라 400g 세트, 1세트 오물조물얌얌 천연해물다시팩 100g, 3개입 모펙트 로얄 프로폴리스 탈모 샴푸 프리지아 베르가못향, 1L, 2개 액츠 파워젤 드럼용 액상세제 본품, 4.21L, 1개 필립스 SkinIQ 7000 시리즈 전기면도기, S7782/65, 미드나잇 블루 이지드롭 일회용 변기크리너 리필브러쉬 12p, 혼합 색상, 5개입 한우물 잡채볶음밥 (냉동), 300g, 6개

728x90
반응형