1. font family
- 폰트 스타일을 지정하는 속성
#title{
font-family: georgia, “Times New Roman”, Times, serif;
}- 폰트 이름에 띄어쓰기가 들어가 있다면 “” 쌍따옴표로 감싸주어야 한다.
- 사용자가 어떤 브라우저를 사용할지 모르기 때문에 폰트 패밀리 값에는 여러가지 폰트를 나열한다.
2.font size
.big-size-font{
font-size: 50px;
}
- 폰트 크기의 단위는 px, em, pt 등 여러가지가 있다.
- 브라우저는 태그에 맞게 기본 스타일을 적용하지만 해당 태그나 클래스, 아이디에 css값이 있다면 해당 스타일을 더 우선순위로 적용하게 된다.
3. font weight
.bold-font{
font-weight: bold;
}- 두께를 조정하는 속성
- normal, bold, 100, 200… 등의 값이 지정될 수 있다.
- 숫자 400 은 normal 과 같은 두께이고 700은 bold와 같은 두께이다.
4.font style
a{
font-style: italic;
}- 글씨 스타일을 바꿔준다
5. color
.yellow{
color: yellow;
}
색상을 더 세밀하게 조정하기 위해서는..
- hex 색상코드: 여섯자리로 표현 - #eb4639
- rgb 값: 빨강, 초록 , 파랑으로 표현 - rgb(235, 70, 57)
- hsl: 색상, 채도, 명도(hue, saturation, lightness)로 표현 - hsl(4, 82%, 57%)
- color picker, color hex to rgb, color picker hex color 등을 이용할 수 있다.
