CSS可以根据语言选择不同的默认字体和大小 [英] Can CSS choose a different default font and size depending on Language

问题描述

我有以下CSS片段：

INPUT{ font-family: Raavi; font-size: 14px;}

当文本框包含一些Punjabi脚本时，这样工作正常：ਪੰਜ

Which works fine when the textbox contains some Punjabi script like this: ਪੰਜਾਬੀ

但是用户可能输入英语，我宁愿使用不同大小的Verdana字体，因为Raavi字体中的英文字母真的很时髦，是错误的。

But the user might enter English instead, and I would rather use the Verdana font with a different size, since the English letters in the Raavi font are real funky and the size is wrong.

所以我的问题可以说成：

So my question could be stated as:

所以我可以创建以下PSEUDO_CSS：

So I could create the following PSEUDO_CSS:

INPUT{ EN-font-family: Verdana; EN-font-size: 12px; PA-font-family; Raavi; EN-font-size: 14px;}

或

INPUT.EN{ font-family: Verdana; font-size: 12px;}
INPUT.PA{ font-family: Raavi; font-size: 14px;}

推荐答案

CSS3，这不会有助于与旧浏览器的兼容性，但它适用于我混合希腊和拉丁文字与不同的字体。这是一个从CSS字体模块工作草案中取得的例子：

This is addressed in CSS3, and that's not going to help for compatibility with old browsers, but it works for me when mixing Greek and Latin text with different fonts for each. Here's an example taken from the CSS Fonts Module Working Draft:

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

unicode范围 bit是魔术键：它告诉浏览器使用这个font-face语句只用于这个特定的Unicode字符块。如果浏览器找到该范围内的字符，则使用此字体;对于该范围之外的字符，它会按照通常的默认模式返回下一个最具体的CSS语句。

The unicode-range bit is the magic key: that tells the browser to use this font-face statement only for this particular block of Unicode characters. If the browser finds characters in that range, it uses this font; for characters outside that range, it falls back to the next most specific CSS statement following the usual pattern of defaulting.

这篇关于CSS可以根据语言选择不同的默认字体和大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！