2010-04-05

Webkit 下中文字体问题的解决 | Solution to the problem of unexpected Chinese fonts in webkit

也许是仅局限于webkitgtk

之前尝试epiphany的时候就发现了这个问题,但是由于epiphany对我来说只是一个备用浏览器,所以没管它。 今天给empathy搞adium主题时这个问题再次蹦了出来,我决定干掉它。

https://bugs.launchpad.net/ubuntu/+source/webkit/+bug/502610 这里有些讨论,里面有个链接指向了改fontconfig的办法,但是我想我这里并不是这个问题,因为我在~/.fonts.conf里已经之定好了我希望的中文字体(主要是serif, sans-serif, monosapce这几个列表),我还是觉得这个是webkit的问题。

empathy有个选项可以开启webkit debug模式:/apps/empathy/conversation/enable_webkit_developer_tools 我用它查看元素,发现字体总是sans...目前解决方法是手工改css,找到.msg的定义,加入 font-family: "font name 1", "font name 2";

另外就是epiphany,虽然它不能给各个语言指定字体,但是好歹支持用户css,于是加入如下内容:

@charset "UTF-8"; // 如果字体名有中文
* {
font-family: "font name 1", "font name 2" ! important;
}

这样问题基本可以解决




Or maybe it's only a bug for webkitgtk, I'm not sure.

Days before I encountered this bug when I was trying epiphany, but I didn't pay much attention on it since I use it only as a backup one. However today the bug came out and started to trouble me again when I was applying an adium theme for empathy, and then I decided to get rid of it.

There are quite some discussions in https://bugs.launchpad.net/ubuntu/+source/webkit/+bug/502610 , and someone there provided a solution that to modify config files of fontconfig. But I think it's not the case at least for me, since I've specified my preferred fonts of the generic font families (serif, sans-serif, monospace). I think it should be webkit's fault.

Enabling "/apps/empathy/conversation/enable_webkit_developer_tools" will enable the debug mode of empathy, where I can inspect the HTML elements (that's cool!), I found the font of messages are all "Sans", and I got no solution except for manually modifying the css file of the theme, just add the following lines in the ".msg" block

font-family: "font name 1", "font name 2";

About epiphany, I wonder why I cannot specify font for different languages/charsets just like firefox, but at least it supports user specified css, so I created one with the following content:

@charset "UTF-8"; // since the name of the font I'm using contains Chinese characters
* {
font-family: "font name 1", "font name 2" ! important;
}

and it works like a charm :)
发表评论