미디어쿼리 (2) 썸네일형 리스트형 반응형 홈페이지 제작의 기초1 (layout) 홈페이지를 제작하는 것은 건축물을 생각하면 이해하기가 쉽습니다. 먼저 토지를 다듬어 건축물을 올릴 장소를 마련한 후, 건축물의 뼈대를 만들고, 전기의 배선 및 수도공사 등 과 인테리어를 끝낸 후 건축을 마무리하게 됩니다. 그 중 뼈대를 만드는 부분이 홈페이지 제작에 있어서는 마크업이라고 부릅니다. 마크업의 대표적 해당 요소는 홈페이지를 구성하는 레이아웃 마크업.(html+css) 영역을 구분 짓는 블록,인라인 마크업,(html+css) 표와 폼 양식을 만드는 테이블 마크업, (html) 글을 게시하는 텍스트 마크업, (html) 으로 크게 4종류를 들 수 있습니다. 그 중 홈페이지를 구성하는 레이아웃 마크업에 대해 알아보겠습니다. 먼저 웹사이트 제작을 시작하기 전에 2가지 측면을 고려하.. 반응형 홈페이지 미디어 쿼리 기본 설명 (@media) 홈페이지를 하나의 레이아웃이 아닌 미디어에 따라 반응하는 형태로 변하게 만드는 별도의 작업을 미디어쿼리 또는 반응형 이라고 부르며, 이를 위한 작업으로 파생된 언어가 바로 웹퍼블리싱과 퍼블리셔입니다. 기존의 레이아웃으로 또 하나의 홈페이지가 미디어에서 다르게 보이는 현상을 말하고, 모두 이용자들을 위한 편의성에서 출발한 것인 만큼, UI,UX와도 밀접한 관계를 지니고 있습니다. 뷰포트 선언 미디어쿼리를 시작하기 전에 메타 태그를 통해 뷰포트적용(반응형 홈페이지) 선언문을 작성 해 줍니다. 이 과정을 건너뛰면 홈페이지가 반응형으로 적용되지 않습니다. 선언문과 관련한 내용은 이 곳을 클릭해 예전 포스팅을 확인 해 주세요. ▲ 각 요소들을 다 적고 제일 하단에 미디어 쿼리를 기술한 모습 body { backg.. 이전 1 다음
