Chrome 强制显示最小字体为 12px?

在 DIV+CSS3 的布局中,我一直以为 IE6 是最难伺候的,一会这个 bug,一会那个 bug,如果能把 IE6 摆平了,那也就天下太平了,兼容其他的浏览器应该也就不成问题。但是,我在制作新的 WordPress 主题中碰到了一个不属于 IE 的杯具问题,在 Firefox、Opera、Safari 甚至在 IE 下都能正常显示的页面居然在 Chrome 下错位了!?这是让人无法容忍的,我可以 kill IE,但我不能把 Chrome 也给 kill 了。

仔细比较后发现,原来是字体大小的问题,我的 Chrome 浏览器居然不支持 12px 以下的字体大小?换了以 pt 或者百分比为单位的字体大小,也都是不管用,Chrome 所能识别的最小字体就停留在 12px 了,我倒~

以下我做了个简单的实验,列出了 font-size:6px; 至 font-size:18px; 的字体大小示例,用 IE、Firefox、Opera、Safari 浏览器的朋友都可以看到一个上宽下窄的梯形状。但是用 Chrome 浏览器的朋友就只能看到 18px 到12px 字体大小的一个上宽下窄的梯形,接下去的 11px 至 6px 都将以 12px 的字体大小显示。

font-size:18px;
font-size:17px;
font-size:16px;
font-size:15px;
font-size:14px;
font-size:13px;
font-size:12px;
font-size:11px;
font-size:10px;
font-size:9px;
font-size:8px;
font-size:7px;
font-size:6px;

我不知道这是 Chrome 的 bug,还是 Chrome 浏览器故意为之,是怕用户看不清 12px 以下的字号吗?而且比 IE 更杯具的是,IE 的 bug 还可以用 CSS HACK 来弥补,而 Chrome 的这个 bug 我都不知道有啥方法可以修正。老革命碰到新问题了,囧~

不知道哪位高手有 Chrome 中小于 12px 字体大小的显示方法呢?不吝赐教啊,在此谢过~

  1. ....这个是浏览器设置的问题。。。
    选项--高级选项--自定义字体--最小字体限制
    不过如果考虑到兼容问题的话确实要在CSS中改

  2. :mrgreen: 谢谢此文,我刚解决这个问题了,就是加一句* {
    -webkit-text-size-adjust:none;
    }
    我升级最新版google浏览器之后问题依旧,只能这样解决了。

  3. 我也在chrome下发现了一个不知道算不算bug的bug,如果给链接加上text-shadow后,text-shadow:1px 1px 0px,第三项模糊必须为0,不然鼠标放上去后字体有被纵向压缩的感觉。在你这里看的还不明显,我的博客如果使用明显太大了。所以为了chrome我放弃了模糊...

  4. 其实解决它的最好方法仅仅只需要在你要写的css里面加上:
    -webkit-text-size-adjust:none;

  5. 应该不算是BUG吧,因为中文文字在小于12px的时候,虽然可以看,但有严重的变形损失,所以我对chrome的做法我表示理解。
    至于解决的办法,我能想到的是:在出现错位的地方使用 overflow:hidden 这样的样式来处理。

  6. 可以用图片撒,根据图片名称调用数字或字母,12一下的中文……不大可能吧。或者做个bg图,改变background 位置吧,同出一辙的想法

  7. 其实这并不是bug。。。有意为之
    只是chrome单方面的认为12px以下的字体看着不舒服,强制力最小字号
    虽然是为用户考虑,但是没有留下选择的余地。。不人性化。
    尽管可以通过修改设置文件解决问题

  8. 到chrome安装目录下的User Data\Default文件夹;
    用记事本打开Preferences,找到:
    "webkit": {
    "webprefs": {
    "default_fixed_font_size": 13,
    "default_font_size": 16,
    }
    在}里面加上:
    "minimum_font_size": 1,
    "minimum_logical_font_size": 1

  9. 我的Chrome 9px以下一样,以上正常……
    不知道是不是和屏幕有关系,Chrome故意为之,检测屏幕大小和分辨率?

  10. 这个倒是还没注意到,只是有时会被chrome的内存占用率弄的烦恼,于是经常去手动删除那很大体积的缓存文件夹
    不过微软的雅黑字体鼓吹的倒是很厉害

  11. 我的是6~9px一个台阶,10~12px一个台阶……跑到别的浏览器围观应该是啥效果去

  12. 说真的,在做主题的一段时间以来,我更觉得 FF 才更符合WEB标准。
    chrome的问题还有很多,不光光只这个font-size的bug吧。
    在JavaScript的一些处理上也和其他浏览器有所不同。

  13. 不是话说,这是CHROME的优点之一么,中文字体在12px以下没法看把,恩恩... ubuntu 下的兼容测试可以找我哦~~

  14. 一直是这样,所以我后来的主题没有小于12px的文字。话说主题最好别让字体影响高度,不然用ubuntu里面的默认的chrome会死的很惨

  15. 嗯,这是个Bug,这个Bug是受Chome自动缩放影响的,当你按Ctrl+-或者Ctrl+滚轮缩放网页的时候,最小只能到12px,这个Bug以前有讨论,但是至今没有解决

  16. This problem could be solved by this way.
    Basically, the Chrome browser is based on WebKit. There are some webkit internal font setting options for font family, font size, etc.

    Using text editor to open "Documents and Settings\User_Name\Local Settings\Application Data\Google\Chrome\User Data\Default\Preferences"
    You will find the "webkit": { "webprefs": { in the file. Those settings are for WebKit.
    In my setting example:
    "webkit": {
    "webprefs": {
    "default_fixed_font_size": 11,
    "default_font_size": 12,
    "fixed_font_family": "Bitstream Vera Sans Mono",
    "minimum_font_size": 12,
    "minimum_logical_font_siz": 12,
    "sansserif_font_family": "Times New Roman",
    "serif_font_family": "Arial",
    "standard_font_is_serif": false,
    "text_areas_are_resizable": true
    }
    }

    The minimum_font_size and minimum_logical_font_size prevent Chrome to use very small font size for display.

    Remember to close Chrome first before you edit the file, or the file you saved will be overwritten by Chome after exiting.