HTML & CSS

[HTML, CSS] 웹 폰트 초기 세팅

피곤핑 2020. 8. 18. 22:42
/* 폰트 초기화 */
body, input, textarea, select, button, table {
    font-family: AppleSDGothicNeo-Regular, 'Malgun Gothic', '맑은 고딕', dotum, '돋움', sans-serif;
}

 

윈도우는 설정이 좀 다를 수 있음 ㅠ

윈도우와 맥의 폰트를 동일하게 해주면 padding 의 차이를 좀 줄일 수 있음!

나눔고딕을 제일 많이 씀 - Google Fonts

https://fonts.google.com/

 

Google Fonts

Making the web more beautiful, fast, and open through great typography

fonts.google.com

 

위 이미지에서 link 부분을 복사한다.

 

    <!-- CSS STYLE -->
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/style.css">
    
    <!-- 웹 폰트 -->
    <link href="https://fonts.googleapis.com/css2?family=Nanum+Gothic&display=swap" rel="stylesheet">

 

아래 이미지를 복사하여 css 에도 붙여넣기 한다.

 

/* 폰트 초기화 */
body, input, textarea, select, button, table {
    font-family: 'Nanum Gothic', AppleSDGothicNeo-Regular, 'Malgun Gothic', '맑은 고딕', dotum, '돋움', sans-serif;
}

 

.header .header-tit h1 {background: #4aa8d4; font-size: 28px; padding:5px 20px 6px 20px; display: inline-block; margin-top: 40px; font-weight: normal; text-transform: uppercase;}

 

설정대로 바뀐 헤더 ㅎㅎㅎ