본문으로 건너뛰기

CSS lang 선택자

:lang selector​

다국어 문서를 만들 때 언어별로 글꼴, 글자 크기, 글자 모양을 변경하고 싶을 때가 있다

class 를 만들고 직접 style 부여해도 되지만, 이럴 때는 lang 속성을 사용하면 훨씬 쉽게 가능하다

코드​

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);
p {
font-family: "Noto Sans KR";
}

p:lang(en) {
font-family: sans-serif;
font-weight:bold;
}
</style>
</head>
<body>
<p>한국어</p>
<p lang="en">English</p>
</body>
</html>

결과​

CSS lang 선택자

언어별 코드​

  • 한국
    • ko
  • 영어
    • en
  • 일본어
    • jp
  • 중국어(간체)
    • zh-cn
  • 중국어(번체)
    • zh-tw
  • 프랑스어
    • fr
  • 스페인어
    • es
  • 독일어
    • de

참고​