unicode - Can CSS choose a different default font and size depending on Language

Question

I have the following CSS fragment:

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

Which works fine when the textbox contains some Punjabi script like this: ??????

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:

• Is there any type of conditional font-family and size selection within CSS based on the input
• Is there anyway for CSS to know about the input language?

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;}

or

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

Answer 1

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;
}

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.