mobssie

  • 홈
  • 태그
  • 방명록

iphoneX대응하기 1

iphoneX 웹뷰 대응하기 (safe-area-inset)

사용법 1. 메타태그 뷰포트에 viewport-fit=cover 를 추가모서리, 센서 하우징 및 홈 버튼을 피하기 위해 동적으로 조정이 가능해 iPhone X의 화면 공간을 최대한 활용할 수 있다. 2. padding-top: env(safe-area-inset-bottom) 으로 기본으로 사용env(safe-area-inset-bottom); // IOS 11.0 이상 (신) constant(safe-area-inset-bottom); // IOS 11.0 버전 (구) 3. 기본적인 padding값이 스타일로 들어가있을 경우에는 calc를 사용하여 정리한다..button { padding: 12px 16px; // 기본 값을 지정해 준후 padding: 12px 16px calc(constant(saf..

CSS 2019.01.16
이전
1
다음
더보기
프로필사진

mobssie

frontend developer 기본기 탄탄! 메모 끄적끄적:d

  • 분류 전체보기 (84)
    • Frontend (44)
      • Javascript (26)
      • Typescript (4)
      • React, Next (0)
      • Vue, Nuxt (8)
      • Angular (0)
      • Node.js (5)
      • react native (1)
    • error 처리 (6)
    • 알고리즘, 자료구조 (6)
    • Dev Tool (3)
    • git (6)
    • API (3)
    • HTTP (4)
    • CSS (2)
    • firebase (2)
    • 나만보는 업무정리 (3)

Tag

iphoneX대응하기, 소스트리 재배치, safe-area-inset, 카카오톡 공유하기, 모바일 웹에서 카카오톡에 공유하기, script, UNMET PEER DEPENDENCY 에러시, 바닐라자바스크립트, sourcetree rebase, vanilla javascript, #Array.prototype.slice.call, safe-area-inset-top, javvascript accordion, viewport-fit=cover, 자바스크립트 아코디언, vanillajavascript, JavaScript, 소스트리 충돌해결, iphoneXcss, JS,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2025/06   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30

방문자수Total

  • Today :
  • Yesterday :

Copyright © Kakao Corp. All rights reserved.

  • git commit message

티스토리툴바