프리랜서 웹디자이너 웹퍼블리셔RELATION

[CSS] 다국어 사이트 폰트 지정

2015.11.13
국문,중문,일문 등 텍스트가 깨질 경우는​ 제일 먼저 DB와 파일 모두 utf-8로 인코딩을 확인합니다.

━━━━━━━━━━━━━━━━━━━━━━━━━━━
국문폰트
━━━━━━━━━━━━━━━━━━━━━━━━━━━
Dotum, \"돋움\", Gulim, \"굴림\", \"Malgun Gothic\", \"맑은 고딕\" 
font-family: Tahoma, \"Microsoft Sans Serif\", sans-serif, Dotum, \"돋움\", Gullim, \"굴림\", \"Malgun Gothic\", \"맑은 고딕\"; 

요즘은 주로 구글에서 제공하는 \"Malgun Gothic\"를 사용함 



━━━━━━━━━━━━━━━━━━━━━━━━━━━
중문폰트(간체)
━━━━━━━━━━━━━━━━━━━━━━━━━━━
\"SimSun \", \"SimHei\", \"Microsoft YaHei\" 
font-family: Tahoma, \" SimSun \", \"SimHei\", \"Microsoft YaHei\" 

FangSong  /  仿宋 

SimSun  /  宋体  /  常规 
SimSun-ExtB 
NSimSun  /  新宋体  /  常规 

SimHei  /  黑体 

Microsoft YaHei  /  MicrosoftYaHeiRegular  /  微软雅黑 
Microsoft YaHei Bold  /  MicrosoftYaHei-Bold  /  MicrosoftYaHeiBold  /  微软雅黑 Bold  /  微软雅黑-Bold 
Microsoft YaHei Light  /  MicrosoftYaHeiLight  /  微软雅黑 Light 
Microsoft YaHei UI  /  MicrosoftYaHeiUI  /  Microsoft YaHei UI Regular 
Microsoft YaHei UI Bold  /  MicrosoftYaHeiUI-Bold 




━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
중문폰트(번체)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
\"MingLiU\", \"Microsoft JhengHei\" 
font-family: Tahoma, \"Microsoft Sans Serif\", sans-serif, \"MingLiU\", \"Microsoft JhengHei\"; 

MingLiU  /  細明體 
MingLiU-ExtB 
MingLiU_HKSCS  /  Ming-Lt-HKSCS-UNI-H  /  細明體_HKSCS 
MingLiU_HKSCS-ExtB 
PMingLiU  /  新細明體 
PMingLiU-ExtB 

Microsoft JhengHei  /  Microsoft JhengHei Regular  /  MicrosoftJhengHeiRegular  /  微软雅黑 
Microsoft JhengHei Bold  /  MicrosoftJhengHeiBold  /  微软雅黑-Bold 
Microsoft JhengHei UI  /  Microsoft JhengHei UI Regular  /  MicrosoftJhengHeiUIRegular 
Microsoft JhengHei UI Bold  /  MicrosoftJhengHeiUIBold 



━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
중문폰트 (대만)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
DFKai-SB  /  DFKaiShu-SB-Estd-BF  /  標楷體 



━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
일문폰트
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
\"MS PGothic\", \"MS PMincho\", Meiryo 
font-family: Tahoma, \"Microsoft Sans Serif\", sans-serif, \"MS PGothic\", \"MS PMincho\", Meiryo; 

MS Gothic  /  MS-Gothic  /  MS ゴシック  /  Microsoft:MS ゴシック 
MS UI Gothic  /  MS-UIGothic  /  標準 
MS PGothic  /  MS-PGothic  /  MS Pゴシック  /  標準 

MS Mincho  /  MS-Mincho  /  MS 明朝  /  Microsoft:MS 明朝 
MS PMincho  /  MS-PMincho  /  MS P明朝  /  Microsoft:MS P明朝 

Meiryo  /  レギュラー  /  メイリオ  /  Microsoft: メイリオ 
Meiryo Bold  /  Meiryo-Bold  /  メイリオ ボールド  /  Microsoft: メイリオ ボールド 
Meiryo Bold Italic  /  Meiryo-BoldItalic  /  メイリオ ボールド イタリック  /  Microsoft: メイリオ ボールド イタリック 
Meiryo Italic  /  Meiryo-Italic  /  メイリオ イタリック  /  Microsoft: メイリオ イタリック 
Meiryo UI  /  MeiryoUI 
Meiryo UI Bold  /  MeiryoUI-Bold 
Meiryo UI Bold Italic  /  Microsoft: Meiryo UI Bold Italic 
Meiryo UI Italic  /  MeiryoUI-Italic 

Yu Gothic  /  YuGothic-Regular  /  游ゴシック  /  游ゴシック Regular 
Yu Gothic Bold  /  YuGothic-Bold  /  游ゴシック Bold 
Yu Gothic Light  /  YuGothic-Light  /  游ゴシック Light 



유명사이트 
Yahoo!JAPAN 
font-family: \'MS PGothic\', Osaka, Arial, sans-serif; 

Google 
font-family: arial, sans-serif; 

FC2 
font-family: Verdana, Arial, Helvetica, sans-serif; 

Microsoft 
font-family: Meiryo, Tahoma, Verdana, Arial, sans-serif; 

Amazon 
font-family: Arial, Verdana, \'Helvetica Neue\', Helvetica, sans-serif; 

Wikipedia 
font-family: sans-serif; 

goo 
font-family: Osaka, Arial, Helvetica, sans-serif; 

ameba 
font-family: \'MS Pゴシック\', \'ヒラギノ角ゴ Pro W3\', Arial, Helvetica;





국문체
-나눔체 : @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

@import url(\\"http://fonts.googleapis.com/earlyaccess/notosanskr.css\\");
font-family: \\'Noto Sans KR\\', sans-serif; 
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url(http://fonts.googleapis.com/earlyaccess/notosanssc.css);

/*  한국어 */ 
:lang(ko) {  font-family: \\'Noto Sans KR\\', sans-serif;  } 
/* 일본어 */ 
:lang(ja) {  font-family: \\'Noto Sans JP\\', sans-serif; } 
/* 중국어 (간체) */ 
:lang(zh-Hans) {  font-family: \\'Noto Sans SC\\', sans-serif; } 
... 생략 ... 
 
.... 생략 .... 
... 한국어 콘텐츠
 
... 일본어 콘텐츠
 
... 중국어 간체 콘텐츠
 



국문(나눔고딕)
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
FONT-FAMILY:'Nanum Gothic'; font-size:12px;


국문(돋움,굴림)
FONT-FAMILY:"돋움", "굴림", "Tahoma" , "Helvetica", "AppleGothic", "sans-serif";


일문
FONT-FAMILY:"Meiryo","MS PGothic","MS UI Gothic", AppleGothic, sans-serif;


중문
font-family: "microsoft yahei","simehei", "Tahoma" , "Helvetica", "sans-serif";

관련 URL
https://www.google.com/fonts/earlyaccess
http://www.google.com/get/noto/#/
http://deminoth.github.io/google-font-kor/



 
전체목록

이 포스트 공유하기

  • 페이스북에 공유하기
  • 트위터에 공유하기
  • 네이버 블로그 카페에 공유하기
  • 네이버 밴드에 공유하기

코멘트 쓰기

코멘트를 입력해주세요
LOGIN JOIN