CSS

Css 폰트 style

Made Project 2020. 3. 29. 15:48

font family

font-family는 폰트 스타일을 지정하는 속성입니다.

#title {

font-family: Georgia, "Times New Roman", Times, serif;

}

브라우저가 Georgia 라는 폰트를 지원해주면 Georgia 폰트로 적용하겠다는 뜻입니다.

만약 Georgia 폰트가 지원되지 않으면, "Times New Roman"을, 이것도 없으면 Times, 그리고 앞의 세 가지 폰트가 전부 없으면 serif라는 폰트를 사용하겠다는 뜻입니다.

 

"Times New Roman"만 ""(쌍따옴표)로 감싸져 있는데,

폰트 이름에 띄워쓰기가 되어있으면 ""(쌍따옴표)를 사용해야합니다.

 

font size

 

h1 {

font-size: 30px;

}

 

.big-size-font {

font-size: 50px;

}

이런식으로 px단위로 태그나 클래스에 직접 줄수있습니다.

 

font weight 

 글씨 두께를 조절하는 property

 

.bold-font {

font-weight: bold;

}

font-weight에는 normal,bold,100...값을 지정하면 됩니다.

 

 

font style

 

a {

font-style: italic;

}

 

font-style 이라는 property로 스타일 변경할수있습니다.

 

 

color

h1 {

color: #eb4639;

}

h1 {

color: rgb(235, 70, 57);

}

h1 {

color: hsl(4, 82%, 57%);

}

 

hex 색상코드는 :여섯자리롤 표현  #eb4639;

rgb 값: 빨강, 초록, 파랑으로 표현 - rgb(235, 70, 57),

hsl: 색상, 채도, 명도(hue, saturation, lightness)로 표현 - hsl(4, 82%, 57%)