Blog

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>
HTML
복사

결과

언어별 코드

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

참고

https://www.w3schools.com/cssref/sel_lang.asp
[신동학](http://github.com/aeun)