목록2024/06/30 (2)
연습장
https://poiemaweb.com/css3-responsive-web-design CSS3 Responsive Web Design | PoiemaWebCSS3 'Responsive Web Design' '반응형 웹디자인' viewport @mediapoiemaweb.com 모바일과 같이 작은 해상도의 디바이스에서 접근했을 때 화면이 너무 작아져 가시성에 문제가 발생한다. 1. Responsive Web Design 개요 layout은 방문자의 화면 해상도를 고려하여야 한다.또한 스마트폰이나 태블릿 등 모바일 기기는 화면이 작기 때문에 가독성에 더욱 신경써야 한다. 이러한 문제를 해결하는 방법 중의 하나가 반응형 웹디자인(Responsive Web Design)이다. 화면 해상도에 따라 가로폭이..
https://poiemaweb.com/css3-layout CSS3 Layout | PoiemaWeb poiemaweb.com layout : 블록 레벨 요소들을 원하는 위치에 배열하는 것이다.반응형 웹 디자인(Responsive Web Design) : 화면의 크기에 따라 적절히 화면 구성을 변화 CSS를 사용하여 layout을 구성할 때에 자주 사용되는 핵심 기술은 float이다.공간을 분할할 때는 먼저 행을 구분한 후, 행 내부 요소를 분리하는 것이 일반적이다. 개인적으론 flex 가 편하지만 모든 브라우저에서 통용될 수 있도록 웹 페이지를 제작하는 크로스 브라우징 측면에서 float 가 더 유리하다고 한다. 아래서는 float 를 주로 다룰 예정 1. Header & Navigation B..