CSS 2

[CSS] CSS 중요 문법 - Flexbox

CSS Flexbox📌 Flexbox의 주요 구조1️⃣ Flex 컨테이너 (Container)✅ Flexbox 레이아웃의 테두리 역할✅ Flex 컨테이너 내의 직접 자식 요소만 Flex 아이템(Item)이 됨.container { display: flex; /* Flex 컨테이너 지정 */}💡 중첩 Flex 가능A 요소 → Flex 컨테이너 지정B 요소 → A의 Flex 아이템B 요소를 다시 Flex 컨테이너로 지정하면 C 요소가 Flex 아이템2️⃣ Flex 아이템 (Item)✅ Flex 컨테이너 내의 요소들✅ 크기, 순서, 정렬 등을 지정 가능.item { flex: 1;}📌 Flexbox의 축1️⃣ 기본 축 (Main Axis)✅ Flex 아이템이 배치되는 방향✅ 기본값 → 가로 정..

[CSS] CSS 기본 문법

CSS (Cascading Style Sheets)📌 CSS란?✅ 웹 페이지의 디자인과 레이아웃을 구성하는 스타일 시트 언어✅ HTML 요소의 스타일을 지정 (글꼴, 색상, 정렬, 배치 등)✅ Cascading(캐스케이딩): 위에서 아래로 흐르는, 상속되는 스타일 적용 방식📌 CSS 스타일 형식/* 기본형 */선택자 { 속성1: 속성값1; 속성2: 속성값2; }✅ 스타일 규칙 → 속성과 값이 하나의 쌍으로 이루어짐✅ 세미콜론( ; )으로 여러 개의 스타일을 지정 가능p { text-align: center; /* 텍스트 가운데 정렬 */ color: blue; /* 글자 색상 변경 */}📌 CSS 스타일 시트✅ 스타일을 한곳에 모아 관리 가능✅ 브라우저 기본 스타일✅ 사용자 스타일 → 인..