[CSS] 폰트

폰트

- 구글 웹 폰트 적용: https://fonts.google.com/

- Font Awesome: https://fontawesome.com/

@charset "utf-8";

/* 폰트의 굵기 */
font-weight: normal;
font-weight: bold; 

/* 폰트의 크기 */
font-size: 60px;
font-size: 1rem; /* 최상위 html 기준 상대 비율로 변환 */
font-size: 1em; /* 부모 태그 기준으로 상대 비율 적용 */

/* 폰트 모양(시스템 폰트: 기본 폰트) */
font-family: "돋움";
font-family: "굴림";
font-family: "serif";
font-family: "arial";

/* 구글 웹 폰트 */
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
font-family: "Nanum Gothic", sans-serif;

/* 웹 폰트 아이콘 */
/* html 파일의 <script>에 fontawesome 링크 붙여넣기 */
<i class="fa-android"></i>
i.fa-android {
  font-size: 100px;
  color: red;
}

/* 폰트 색: 키워드, rgb, 16진수 */
color: red
color: rgb(42,255,255);
color: #2bcde2;

/* 줄 높이 변경 */
line-height: 40px;
line-height: 1.5; /* 글자 크기 기준 비율*/

/* 정렬: 기본값 left */
text-align: left; 
text-align: center;
text-align: right;
text-align: justify; /* 양쪽 정렬 */

/* 글자 간의 간격(자간): 기본값 0px */
letter-spacing: 2px;
letter-spacing: -2px;