HTML과 CSS의 연결
HTML 요소에 스타일을 적용하려면 CSS를 <style>, style.css 파일, 또는 style 속성을 통해 연결합니다.
선택자와 선언
선택자 { 속성: 값; }형식으로 스타일을 선언합니다.태그 선택자: 태그 이름으로 선택합니다. 예:p {}.클래스 선택자: 클래스 이름으로 선택합니다. 예:.menu {}#아이디 선택자: ID로 선택합니다. 예:#header {}부모 자식 선택자: 계층 구조를 기준으로 선택합니다. 예:div > p
텍스트 스타일
color: 글자 색상을 지정합니다.font-size: 글자의 크기를 지정합니다.font-weight: 글자의 굵기를 설정합니다.text-align: 글자 정렬(왼쪽, 가운데, 오른쪽)을 지정합니다.font-family: 글꼴을 지정합니다.
레이아웃과 표시 방식
display: 요소의 표시 유형을 설정합니다. (block,inline,inline-block등)margin: 요소 바깥쪽 여백입니다.padding: 요소 안쪽 여백입니다.box-sizing: 요소 크기를 계산할 때padding과border포함 여부를 지정합니다. (content-boxvsborder-box)
박스 모델
HTML 요소는 기본적으로 콘텐츠(content), 안쪽 여백(padding), 테두리(border), 바깥 여백(margin)으로 구성된 박스 형태입니다.
포지션 속성
static: 기본 위치(기본값)relative: 원래 위치 기준으로 이동absolute: 가장 가까운 position 지정 부모 기준 위치fixed: 화면 기준으로 고정됨 (스크롤해도 유지)