Question

一个让人纠结的CSS问题：该用哪个中文字体

Answer 1

如果定义了，你用的是哪些中文字体？你为这个问题纠结过吗？我们纠结过，而且是相当纠结。先看看我们现在所用的 CSS：body { font-family: Verdana,Arial,Helvetica,sans-serif; }是的，根本没有定义中文字体，直接使用浏览器的默认字体。如果你没有修改过，在 Windows 7 中 Chrome 与 Firefox 安装后的默认字体都是“微软雅黑”；唯独 IE 不是，根据目前观察的情况，IE 的默认字体用的是 SimSun-ExtB（宋体）。我们这样的 CSS 定义虽然会造成 IE 浏览器与非 IE 浏览器显示的字体不一致（IE 用户可以通过修改浏览器的默认字体解决这个问题），但这是一个情非得以的选择。你也许会问为什么不直接在 CSS 中把字体定义为“微软雅黑”,“宋体”？这样在 Windows 系统上 IE 浏览器与非 IE 浏览器都统一用“微软雅黑”显示；非 Windows 系统（没有“微软雅黑”字体），就统一用“宋体”显示。我们这么想过，也这么做过。但是现实很残酷。虽然都是姓“微软“，名叫“雅黑”，但是在不同版本 Windows 上的显示效果却不一样。比如，Windows XP 与 Windows 7，一个很丑，一个很漂亮。显示效果不一样，却又用同一名字。于是，纠结就来了。如果在 CSS 中定义第一个中文字体为“微软雅黑”，Windows XP 的用户很有意见（“微软雅黑”在 XP 中的确很丑）；如果定义为“宋体”，Windows 7 的用户又不答应（“微软雅黑” 在 Win 7 中的确比“宋体”好看）。如果Windows 7 与 Windows XP 中的“微软雅黑”使用不同的名字，就不会有这个纠结的问题。比如 Windows 7 中叫“微软雅黑2”，CSS 可以这样写：body { font-family: Verdana,Arial,Helvetica,微软雅黑2,宋体,sans-serif; }这样的话，Windows 7 中的浏览器会用“微软雅黑2”字体进行显示。Windows XP 中由于没有这个名字的字体，就用“宋体”显示，多好。面对这样的纠结问题，目前折衷的办法就是本文开头的 CSS 定义，不定义中文字体，使用浏览器的默认字体。这样至少 Chrome 与 Firefox 没问题，高级一点的 IE 用户也没有问题。对于其他的 IE 用户，与其让他们去改 IE 的默认字体，还不如让他们换浏览器。你也许会说，我一点不纠结，我觉得在 Windows 7 中用 IE 的默认字体（宋体）挺好。微软才不会让你这么舒服呢。根据园友 Learning hard 的反馈，我们发现，如果 CSS 中没定义中文字体，而且 IE 用的是默认宋体，那么在文本框中输入文字时，如果通过键盘上的箭头向后移动光标，光标会突然消失。。。虽然不纠结，但你会很郁闷。