码迷,mamicode.com
首页 > 其他好文 > 详细

解决 Chrome 浏览器自动调整小于11px字体的问题

时间:2016-10-27 13:08:47      阅读:131      评论:0      收藏:0      [点我收藏+]

标签:字体   英文   宽度   web   text   12px   自动   大小   高级   

不知道说是 Chrome 智能呢?还是说它多此一举?Chrome 浏览器中存在默认会自动将小于11px大小的字体调整为12px。我在写 BlueNight 主题的最新评论时候就设置了评论发布时间为11px,无意中有再次发现 Chrome 的这个字体显示问题(最早还是在阿里国际站的时候第一次遇到这个问题)。

看看这样的代码:

.date-small{
    font-size:11px;
}
.date-normal{
    font-size:12px;
}

用 Chrome 浏览器打开,你会发现两个 CSS 产生的显示结果是一样的,11px自动变为了12px。一般情况下,字体大1px没有多大影响,但是像 BlueNight 最新评论那样显示宽度有限的情况下,字体大1px可能就造成布局的显示问题了。好在问题比较容易解决:-webkit-text-size-adjust:none;,就可以帮我们解决这个问题。我们只需要这么写:

.date-small{
    font-size:11px;
    -webkit-text-size-adjust:none;
}

size-adjust?小于12px的英文字体显示起来还是很好看的,不知道Google的工程师是出于什么原因考虑要adjust。好在我们可以将 -webkit-text-size-adjust 设置为none来解决。不过在另外一个主流的浏览器Opera中,就没有这么幸运了。没有-o-text-size-adjust,这样的 CSS 属性,在Opera,我们就只用通过自己手动设置了:工具->首选项->高级->字体->最小字体大小(像素)。

解决 Chrome 浏览器自动调整小于11px字体的问题

标签:字体   英文   宽度   web   text   12px   自动   大小   高级   

原文地址:http://www.cnblogs.com/kimshen/p/6003318.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!