[CSS] 주요 속성

✔ 크기 조절 속성

- width

    - 선택한 요소의 너비를 설정

    - 픽셀(px) : 절대적인 크기

    - 퍼센트(%) : 웹 브라우저 안에서 차지하는 상대적인 크기

    

- height

    - 선택한 요소의 높이를 설정

 

✔ font

- font-size

    - 글자 크기 지정

 

- font-family

    - 글꼴을 여러 개 지정할 수 있음

    - 브라우저마다 지원하는 폰트가 다름

    - 입력한 순서대로 우선순위 적용

    - sans-serif는 마지막에 작성하는 디폴트 값

 

- font-style

    - 글자의 스타일 지정

    - normal : 어떠한 스타일도 적용하지 않음

    - italic : 이탤릭체 (기울기)로 나타냄

    - oblique : 텍스트를 기울임, italic과 유사하지만 지원하는 웹 브라우저가 거의 없음

    - 주로 'italic'을 사용하기 위함

 

- font-weight

    - 글자 두께 지정

    - lighter < normal < bold < bolder

    - 100 ~ 900 사이의 숫자를 입력할 수도 있음

 

✔ border

- 어떤 구역 혹은 정보의 경계를 표현하는 방법을 지정하는 속성

 

- border-style

    - solid : 실선

    - dotted : 점선

 

- border-width

    - 경계의 너비

 

- border-color

    - 경계의 색

 

=> 한줄에 작성할 경우, 쉼표는 작성하지 않고 띄어쓰기만 함 (이미지 주석 참고)

 

✔ background

- 어떤 요소의 배경 지정

 

- background-color

    - 배경 색 지정

 

- background-image

    - url(이미지 경로)

    - 배경으로 지정할 이미지 설정

 

- background-repeat

    - 배경에 이미지가 지정된 경우, 해당 이미지가 요소보다 작을 때의 설정값

    - repeat-x : x축(가로)으로 이미지 반복

    - repeat-y : y축(세로)로 이미지 반복

    - no-repeat : 반복하지 않음

 

- background-position

    - 이미지의 좌표 변경

    - top, bottom, center, left, right 등