responsivewebdesign (1) 썸네일형 리스트형 [html/css] 반응형 웹디자인 기초 정리(1) * 반응형 웹 디자인(Responsive web design) : 화면 크기에 반응해 화면 요소들을 자동으로 바꾸어 사이트를 구현하는 것을 말합니다 1. 뷰포트(viewport) : PC화면과 모바일 화면의 픽셀 표현 방법이 다르기 때문에 뷰포트를 지정하면 접속한 기기에 따라 화면에 맞추어 확대하거나 축소하여 표시하여 줍니다. 즉, 뷰포트는 스마트폰 화면에서 실제 내용이 표시되는 영역입니다. 아래는 웹키트(webkit)기반의 기본 뷰포트 너비입니다. ---> 뷰포트 너비를 스마트폰 화면너비에 맞추고 초기화면 배율을 1로 지정합니다. 대부분의 웹페이지 html을 작성할 때 헤드에 꼭 들어갑니다. 2. 가변 그리드(fluid grid) 레이아웃 요소 어떤 기기에서도 동일한 레이아웃을 가지면서 기기의 특성에 .. 이전 1 다음