모바일 환경에서의 뷰포트 높이: vh에서 dvh로 전환하기
안녕하세요 찐망고 입니다. 오늘은 모바일 뷰포트 관련 이야기를 포스팅 해볼게요 vw와 vh는 뷰포트 너비와 높이를 이야기합니다. 폰트나 여백이나 길이의 단위를 뷰포트 단위를 사용하게 되면, 아무래도 브라우저 사이즈에 영향을 받겠죠? 1vw는 뷰포트 너비를 기준으로 100분의 1인데 만약 브라우저 사이즈가 1850px이라면 1vw는 18.5px이라고 생각하면 됩니다. 1vh는 뷰포트 높이를 기준으로 100분의 1이고 브라우저 높이에 따라 변하겠죠? 요소 높이에 100vh를 주게 되면 전체 높이에 꽉 차게 작업을 할 수 있는데 모바일에선 이슈가 좀 있습니다. 모바일 주소 표시줄 영역 때문인데요. 저렇게 주소표시줄 때문에 밀리는 현상 많이 보셨나요? ㅎㅎ 그래서 풀페이지 사이트 만들 때도 저런 현상들 때문에 ..
WEB/CSS
2024. 4. 9. 19:26
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- 웹표준
- margin
- boxmodel
- 크로스브라우징
- CSS3
- UI디자인
- 포토샵합성
- JavaScript
- 반응형웹
- 코딩교육
- uxdesign
- uiux
- Border
- 자바스크립트숫자카운트
- 스마트폰해상도
- slickAPI
- 피그마플러그인
- 웹접근성
- css그리드
- JavaScriptTips
- css4
- 슬라이드플러그인
- padding
- 프로그래밍기초
- Slick
- 디자인팁
- uidesign
- 시멘틱마크업
- 웹디자인
- css
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
글 보관함