부트스트랩 (Bootstrap) | Notion

목차

UI Framework
Bootstrap 개요
Container
Utilities
Components
Grid System

UI Framework

UI Framework는 웹 UI 요소를 일관되고 효율적으로 제작할 수 있도록 돕는 CSS 기반의 라이브러리
반응형 디자인 및 컴포넌트 중심의 UI 설계에 최적화

종류	설명
Bootstrap	가장 널리 쓰이는 CSS 프레임워크, 반응형 레이아웃 제공, 다양한 컴포넌트 지원
Tailwind CSS	클래스 기반 유틸리티 프레임워크, 자유도 높음
Semantic UI	의미 중심의 클래스 명칭, 테마 시스템 강조

Bootstrap 개요

Twitter에서 개발한 오픈소스 프론트엔드 UI 프레임워크
빠른 프로토타이핑과 프론트 개발에 유용
반응형 디자인 지원 + 다양한 UI 컴포넌트 제공
단점: 커스터마이징이 어렵고 디자인이 정형화되는 경향 있음

주요 구성 요소

요소	설명
`Container`	기본 레이아웃 틀 제공
`Grid`	열/행 기반 레이아웃 시스템
`Components`	버튼, 폼, 카드 등 미리 정의된 UI
`Utilities`	색상, 정렬, 간격 등을 빠르게 제어하는 클래스 집합

Container

페이지 레이아웃의 기본 틀