CSS.05. Values & Units

속성(properties): 스타일을 적용할 대상의 특성

>> 변경하고자 하는 스타일의 종류를 지정

>> 속성은  CSS  규칙 내에서 선언되며, 콜론 뒤에 해당 속성에 적용할 값을 지정

 

값(values): 속성에 할당되어, 그 속성이 어떻게 적용될지를 구체적으로 명시

>> 속성이 실제로 어떤 스타일을 나타낼지를 결정

>> 값은 속성 다음에 오며, 세미콜론으로 구문을 종료하기 전에 속성 값으로 지정

 

CSS 값(데이터 유형)

>> CSS에서 특정 속성에 유효한 데이터를 지정하는 것

 

길이와 거리

절대 길이 단위

>>px(픽셀): 가장 일반적으로 사용되는 절대 길이 단위

 

상대 길이 단위

>>rem, em: 루트 요소의 글꼴 크기 / 요소의 글꼴 크기

>>vw, vh: 뷰포트의 너비, 높이의 백분율로 나타내는 단위

백분율

>>부모요소의 크기에 상대적인 크기를 설정하는 단위>>유연한 레이아웃 디자인에 사용

 

시간

1s === 1000ms

 

색상

16진수로 표현: #NNNNNN

hsl | hsla로 표현: 색상, 채도, 명도, 불투명도

영문명으로 표현: 'red'...

rgb | rgba: 빨강, 초록, 파랑, 불투명도

 

이미지

url('image/path.jpg')과 같이 이미지 경로를 지정할 때 사용

 

함수

여러번 실행할 수 있는 재사용 가능한 코드 섹션 생성

 

calc()

CSS내에서 간단한 계산을 수행

다른 단위의 값들을 계산하는데 사용

 

var()

CSS변수의 값을 사용할 때 사용