본문 바로가기

홈페이지 레이아웃

(2)
홈페이지 레이아웃 제어와 영역 분배하기 (column) 각 컨테이너 요소들로 화면을 제어해 준 후, 다단을 나누어 해당 하는 넓이에 맞게 차례대로 컨텐츠를 나열하는 것을 칼럼(column)이라고 합니다. 쉽게 생각해 신문과 같은 나누어 기입하는 나열 형식을 말하는데, 웹 페이지에서 많이 쓰이는 이미지와 설명을 보기좋게 분야별로 나열하는 배치입니다. 이와 같은 칼럼은 아래와 같은 명령문으로 직접 나열하는 것을 제외하고, 그리드 형식인 부트스트랩 같은 자동 레이아웃을 rel속성으로 첨부해 도움을 받는 것이 훨씬 쉽고 간편한데, 그 전에 칼럼 속성의 의미를 인지하고 있어야 사용하기 편리합니다. column 행과 열 중에서, 열 속성을 지정하는 칼럼(column)은 줄여 col 이라는 표기로 통칭 많이 사용됩니다. 그리드라고 부르는 것이 좀 더 어감이 쉬운데, 홈페..
홈페이지 레이아웃이 범위를 벗어날 때 (min,max,overflow) 모바일과 태블릿, PC 3가지를 염두에 두고 작업하는 홈페이지의 특성상 각 기기별로 레이아웃을 맞추어 주어야 할때가 있는데, 이는 %로 수치를 지정해 각 영역크기를 지정해주는 것을 비롯. 컨텐츠에 대한 영역을 자동으로 잡아주는 명령문을 포함해야 좀 더 가독성과 접근성이 높아지는 효과가 있습니다. 반응형으로 컨텐츠를 제작할 때, 항상 헤깔리는 min,max 명령문입니다. overflow 컨테이너를 잡은 박스에 컨텐츠가 벗어나게 될 경우 설정해주는 기능으로 너무 큰 컨텐츠를 제어할 때 사용합니다. overflow는 기본값으로 x와 y 축을 경계로 디테일하게 제어하는 방법도 사용할 수 있습니다. [기본 값] overflow : 상하좌우 기본값 적용 overflow-x: 왼쪽 / 오른쪽을 어떻게 처리할지를 지정..