TwentyTwentyOne

✅ CSS Flexbox와 Grid의 차이점과 사용 사례는?프론트엔드 면접에서 “Flexbox와 Grid의 차이점은?”이라는 질문은 단순 문법 암기보다는, 어떤 상황에 어떤 레이아웃 시스템을 선택하는지를 통해 레이아웃 설계에 대한 감각을 확인하려는 질문입니다.이번 글에서는 두 레이아웃 시스템의 철학적 차이, 실제 사용 예제, 실무에서의 선택 기준까지 완벽히 정리합니다.📌 1. Flexbox vs Grid – 핵심 개념 비교항목 Flexbox Grid축1차원(주축/교차축)2차원(행과 열 모두)정렬 단위아이템 중심 정렬레이아웃 전체 구조 중심 정렬제어 방향한 방향 (row/column)행과 열 동시 제어사용 목적컴포넌트 내부 정렬전체 페이지/섹션 레이아웃브라우저 지원IE11 일부 지원IE는 미지원 (Mod..

아래 글은 “웹 개발 기초부터 실무까지” 시리즈의 두 번째 글입니다. 이번 글에서는 HTML/CSS의 기초 문법과 더불어 반응형 레이아웃(Responsive Web Design) 개념까지 다룹니다. 웹 개발의 가장 중요한 출발점인 HTML/CSS를 탄탄히 익혀두면, 이후에 배울 자바스크립트 및 프레임워크 사용 시 훨씬 수월해집니다.1. HTML 기초 다지기1-1. HTML 구조HTML은 HyperText Markup Language의 약자로, 웹페이지의 구조를 정의하는 데 사용됩니다.간단한 HTML 문서 예시는 다음과 같습니다. 안녕하세요! 이곳은 HTML 예시입니다.: HTML5 문서임을 선언: 루트(root) 요소, 보통 lang 속성으로 문서 언어 설정 반응형 웹 예제 내비..