스타일 속성

CSS 스타일 속성

스타일 속성

HTML 요소에 어떤 스타일을 적용할 지 지정하는 키워드

구성 요소

CSS 스타일 속성 이름은 케밥 케이스로 정의되어 있습니다.

스타일 속성

글꼴 속성 (Font Properties)

텍스트의 기본 스타일을 설정합니다.

자주 사용하는 속성

글꼴 속성 종류

기본 예시 코드

폰트 지정하는 방법

외부 폰트

파일 폰트

메인 폰트 & 강조 폰트

텍스트 속성

텍스트 표현 방식을 제어하는 속성

텍스트 속성 종류

기본 예시 코드

텍스트 반응형 스타일

상대 단위 사용

@media (미디어쿼리) 사용

clamp() 함수 사용

calc() 함수 사용

텍스트 속성

여백 속성

배경 속성

배경을 제어하는 속성

배경 속성 종류

배경 그라데이션 함수

기본 예시 코드

배경 속성 응용

배경 고정 스크롤

텍스트 마스크

이미지 마스크

위치 속성

위치 설정 기준과 크기를 지정하는 속성

위치 속성 종류

위치 설정 기준

static

relative

absolute

fixed

sticky

기본 예시 코드

위치 속성 활용

배치 속성

요소를 컨테이너 내에서 어떻게 배치할 지를 지정하는 속성

배치 속성 종류

기본 예시 코드

배치 속성 종류

표현 속성

요소의 시각적 표현 방식을 제어하는 속성

표현 속성의 종류

기본 예시 코드

표현 속성의 종류

변형 속성

요소의 크기, 모양, 위치를 변형시키는 속성

변형 속성의 종류

전환 속성

스타일 속성의 변경 시 변경값으로 전환되는 스타일을 지정하는 속성

변환 속성 종류

기본 예시 코드

타이밍 속도 생성 사이트

애니메이션 속성

요소에 움직임을 지정하고 프레임별 스타일을 지정하여 애니메이션 효과를 주는 속성

애니메이션 속성의 종류

기본 예시코드

애니메이션 속성 응용

애니메이션 속성