반응형 반응형 웹2 멋쟁이사자처럼 프론트엔드 부트캠프 14기 - Day 14 (반응형 웹, 논리 속성 및 논리 값, 플렉시블 레이아웃) 목차반응형 웹논리 속성 및 논리 값플렉시블 레이아웃오늘 하루를 돌아보며 학습 목표 → 과정 → 결과 → 느낀 점 → 향후 계획반응형 웹방응형 웹은 유연하게 설계하는 서비스다. 2000년대를 기점으로 모바일 기기가 등장하면서 기술 플랫폼의 패러다임이 변화를 맞이했다. 데스크탑 중심 서비스가 모바일 중심 서비스로 이동하면서 기업들이 별도로 모바일 환경에 최적화된 대응을 시작한다. 그러나 모바일 디바이스의 크기가 다양해지면서 N Screen 환경을 고려하는 것이 필요해졌다. 고정형 레이아웃을 사용했던 서비스가 각 환경에 대응하기에는 개발 및 유지보수, 비용 관점에 대한 고민이 발생한다. 이때 반응형 웹이 필요해졌다. 콘텐츠는 물과 같아야 한다는 말이 있다. 컵에 담든, 주전자에 담든, 유리병에 담든 모양은 .. 2025. 5. 12. 멋쟁이사자처럼 프론트엔드 부트캠프 14기 - Day 13 (미디어 쿼리, 반응형 웹, 컴포넌트 스타일링) 목차meta 요소미디어 쿼리반응형 웹컴포넌트 스타일링오늘 하루를 돌아보며 meta 요소meta는 문서를 설명하는 데이터인 메타 데이터를 담는 요소다. 에서 charset 속성은 웹 페이지의 문자 인코딩을 지정한다.UTF-8은 유니코드(Unicode)를 위한 가변 길이 문자 인코딩 방식이다. 전 세계의 거의 모든 문자와 기호를 표현할 수 있다. 그래서 title 요소를 meta 요소보다 위에 선언하면 탭 제목이 깨질 수 있다. 에서 viewport는 브라우저에 보이는 영역이다. 뷰포트의 width를 기기 크기에 맞추고, initial-scale(초기 배율)을 1로 맞춘다는 뜻이다. initial-scale을 설정하는 것은 핀치 제스쳐(줌인 줌아웃)를 할 때 2배, 3배, 0.5배로 확대하거나 축소할 수 있.. 2025. 5. 9. 이전 1 다음 반응형
