[필기] CSS 기초 (2)

구글 폰트 적용 방법 

---

CSS에서 글꼴 속성 지정

 

•  font-family: 글꼴의 이름을 지정합니다.
•  font-size: 글꼴의 크기를 지정합니다.
•  font-weight: 글꼴의 굵기를 지정합니다.
•  font-style: 글꼴의 스타일을 지정합니다.
•  font-variant: 글꼴의 변형을 지정합니다.
•  font-stretch: 글꼴의 스트레치를 지정합니다.
•  line-height: 줄 간격을 지정합니다.
•  letter-spacing: 글자 간격을 지정합니다.
•  word-spacing: 단어 간격을 지정합니다.
•  text-align: 텍스트의 정렬을 지정합니다.
•  text-indent: 텍스트의 들여쓰기를 지정합니다.
•  text-transform: 텍스트의 변환을 지정합니다.
•  text-decoration: 텍스트의 장식을 지정합니다.
  
  
  

---

글꼴 사이즈 단위

• px : 픽셀은 화면의 물리적인 크기를 기준으로 하는 단위입니다.
• pt : 포인트는 1/72인치를 기준으로 하는 단위입니다.
• em : em은 부모 요소의 글꼴 크기를 기준으로 하는 단위입니다.
• rem : rem은 루트 요소의 글꼴 크기를 기준으로 하는 단위입니다.
• % : 백분율은 부모 요소의 너비 또는 높이를 기준으로 하는 단위입니다.

---

폰트 컬러를 지정 표기법

 

• 색상 이름 : 예를 들어, `red`, `blue`, `green`, `black`, `white`, `transparent` 등
• 16진수 색상 : 예를 들어, `#FF0000`, `#0000FF`, `#00FF00`, `#000000`, `#FFFFFF`, `#00000000` 등
• RGB 색상 : 예를 들어, `rgb(255, 0, 0)`, `rgb(0, 0, 255)`, `rgb(0, 255, 0)`, `rgb(0, 0, 0)`, `rgb(255, 255, 255)`, `rgba(255, 0, 0, 0)` 등
• HSL 색상: 예를 들어, `hsl(0, 100%, 50%)`, `hsl(120, 100%, 50%)`, `hsl(240, 100%, 50%)`, `hsl(0, 0%, 0%)`, `hsl(0, 100%, 100%)`, `hsla(0, 100%, 50%, 0)` 등
  
  

---