CSS 기본 스타일 변경하기

- 색상 관련

- color: red

- color: rgba(255, 0, 0, 0.5)

- color: rgb(255, 0, 0)

- color: #ff0000

- 이처럼 값 / rgba() / rgb() / #16진수 로 색상값을 표현할 수 있음

- 일반적으로 16진수로 많이 표현함

- VSCode에서 color picker 사용 가능

- 글자 크기 관련

- font-size: 16px

- font-size: 1em

- em은 기본 글자 크기의 배수를 위한 단위.

- px는 절대적, em은 상대적

- 글자 기본 크기는 16px, 따로 설정하여 기본값을 변경할 수 있고, 이 경우 상대 크기도 달라지게 됨.

- 글꼴 관련

- font-family: monospace, sans-serif;

- 앞에서부터 시작하여 브라우저가 해당 글꼴을 지원하지 않는다면 후순위에 있는 글꼴을 적용

- 배경 관련

- background-color: #ff0000

- background-image, background-position, background-repeat 등의 속성이 있음

- 한 줄로도 정의 가능

- background: #ff0000 url(".../png") no-repeat center top;

- 웹 폰트

- 브라우저에서 기본으로 제공하지 않는 폰트를 웹에서 다운로드 받아 사용

- 장점 : 예쁘게 웹 사이트를 구성할 수 있음

- 단점 : 다운로드를 받아야 하므로 오래 걸릴 경우 사용자에게 불편함을 줄 수 있음 / 다양한 해상도에서 깨질 위험이 있음

- 벡터 방식의 아이콘 웹폰트를 사용하면 다양한 크기에서 품질을 유지할 수 있음

- 기본 유니코드를 사용해서 간단한 아이콘을 표현할 수 있음

- &#x263a : 웃는 아이콘, 세미콜론으로 마무리 지어야 함