「CSS」- 不同语言 使用 不同字体

  CREATED BY JENKINSBOT

问题描述

我们需要为不同语言使用不同字体。比如,对于英文我们使用 Consolas 字体,对于其他语言使用 Microsoft Yahei 字体,

解决办法

@font-face {
    font-family: Consolas;
    /* src: url(fonts/Consolas.ttf) format("opentype"); */
    unicode-range: U+00-FF, U+980-9FF;
}

body {
	font-family: "Consolas", Microsoft Yahei
}

当浏览器发现字符在 unicode-range 内时,将使用该字体渲染字符。

注意事项:
1)属性 @font-face 相当于“对字体进行配置”,我们需要在其他地方使用该字体(即如上 body 中使用 Consolas 字体)

参考文献

unicode – Can CSS choose a different default font and size depending on Language – Stack Overflow
unicode-range – CSS: Cascading Style Sheets | MDN