jfmam 개발 블로그

개요 회사 렌딩페이지를 만들면서 모바일, 태블릿 등 다양한 기기 환경에서도 볼 수 있는 UI를 제공하기 위해서 반응형을 고려하였다. 해당 글은 프로젝트를 진행하면서 학습했던 것을 정리 하는 용도로 작성되었으며 참고용으로 봐주었으면 한다 목차 뷰포트 설정하기 break point (중단점) 설정하기 비율 설정을 통해 화면 크기에 맞추기 뷰포트 설정하기 디바이스 화면크기에 맞추며 초기배율은 1배수(100%)를 따른다. 또한 핀치줌을 지원하여 확대 축소가 가능하게 지원한다. 핀치줌이란? 모션을 통해 확대 축소를 하는 행위를 말한다. 모니터로는 컨트롤+ 스크롤 모바일로는 검지와 엄지를 대각선으로 벌리고 줄임으로써 확대축소를 할 수 있다. 예시 break point(중단점) 설정하기 중단점을 설정함으로써 다양한 ..