当样式设定font-size<12px时,chrome浏览器里字体显示仍为12px;
如font-size:11px; 但是chrome还是12px的大小,很不听话。

今天我就遇到了这样的问题?
网站产品分类块字体在IE9和FF下显示不正常,比预想的要小,在IE7\IE8\360\chrome里显示正常,我查了些资料就是没找到原因,问了网友才得到解决办法。

-webkit-text-size-adjust

1、当样式表里font-size<12px时,中文版chrome浏览器里字体显示仍为12px,这时可以用 html{-webkit-text-size-adjust:none;}

2、-webkit-text-size-adjust放在body上会导致页面缩放失效

3、body会继承定义在html的样式

4、用-webkit-text-size-adjust不要定义成可继承的或全局的

苹果移动设备上会识别,用于保证文字大小。

写页面的应该都知道Chrome浏览器默认情况下的字体最小为12px,如果你要设置某字体大小为10px的话,你会在Chrome发现还是12px。如果要使此生效的话,就得修改Chrome的默认配置了,一般应用下面的代码就能在全局生效了:

html { -webkit-text-size-adjust: none; }

但是这样设置之后会有一个问题,就是当你放大网页时,一般情况下字体也会随着变大,而设置了以上代码后,字体只会显示你当前设置的字体大小,不会随着网页放大而变大了,这样对有需要放大网页观看的用户造成了不好的用户体验,所以不建议全局应用该属性,而是在需要的情况单独使用就好了。

在中文版Chrome里面,网页CSS里所有小于12px的字体设置都无效,最终将显示12px。这样弄的本意可能是好的,因为中文一旦小于12px,就变得不易阅读。

但中文版Chrome也会阅读英文网站啊!中文网页里面也会有英文的小字体设置需求啊!尤其是一些文字部份的设计,不小实在不好看,影响整个排版的美观。

解决方案,添加一个私有属性到html选择器:
html{-webkit-text-size-adjust: none;}

顾名思义, 禁用Webkit内核浏览器的文字大小调整功能。

注:如果要改变字体大小,font-size:15px;应该写在 -webkit-text-size-adjust: none;之后,不然效果不显示 。

chrome浏览器font-size<12px无效解决办法的更多相关文章

  1. chrome浏览器首页被hao123劫持解决办法

    在chrome浏览器设置里面将新标签页地址改为www.baidu.com, 不过一般来说这个办法完全没用,因为我们面对的是史无前例的大流氓. 查看桌面chrome的快捷方式是否被篡改.右键快捷方式,点 ...

  2. Chrome浏览器所有页面全部崩溃解决办法。

    今晚写代码的时候更新了一下Chrome,结果打开所有网页都提示 喔唷 崩溃了,而且找到c盘内没有bd0001.sys文件,电脑内也无任何百度系的软件,此解决办法pass. 折腾了半天从google中找 ...

  3. Chrome下font-size小于12px的解决办法

    自从Chorme取消了-webkit-text-size-adjust,这个问题又变得令人烦恼起来. 好在我们可以利用-webkit-transform这个私有属性. .box{ -webkit-tr ...

  4. 中文版Chrome浏览器不支持12px以下字体的解决方案

    中文版Chrome浏览器不支持12px以下字体的解决方案 Chrome 27之前的中文版桌面浏览器会默认设定页面的最小字号是12px,英文版则没有限制,主要是因为chrome认为汉字小于12px就会增 ...

  5. Chrome浏览器 js 关闭窗口失效解决方法

    //获取元素ID var DelHtml = document.getElementById("imgdel"); //alert(DelHtml); //添加点击事件 DelHt ...

  6. iOS 发布证书提示 此证书的签发者无效 解决办法

    1. 打开钥匙串  查看发布证书 都是提示 此证书的签发者无效   解决办法 : 2. 到了 第 4 步骤 再去 查看 发布证书 就会 显示  此证书有效 3.  如果还不可以 就 把 Apple W ...

  7. IDEA Spring-boot-devTools 无效解决办法二

    转载地址:Intellij IDEA 使用Spring-boot-devTools无效解决办法 相信大部分使用Intellij的同学都会遇到这个问题,即使项目使用了spring-boot-devtoo ...

  8. HTTP 错误 500.19 请求的页面的相关配置数据无效 解决办法

    "HTTP 错误 500.19 请求的页面的相关配置数据无效" 解决办法   HTTP 错误 500.19 - Internal Server Error无法访问请求的页面,因为该 ...

  9. 在vue中使用 layui框架中的form.render()无效解决办法

    下面简单介绍在vue中使用 layui框架中的form.render()无效解决办法. 原文地址:小时刻个人技术博客 > http://small.aiweimeng.top/index.php ...

随机推荐

  1. 【JVM学习笔记一】JVM内存分布

    Overview 学习JVM首先需要了解一下JVM管理的内存是如何分布的,在看了<深入理解Java虚拟机>和一些博文之后,我准备自己记录一下学习的过程. 下图是JVM中运行时数据区的大致示 ...

  2. 分享27款最佳的复古风格 WordPress 主题

    WordPress 作为最流行的博客系统,插件众多,易于扩充功能.安装和使用都非常方便,而且有许多第三方开发的免费模板,安装方式简单易用. 复古风格可以应用于任何东西,从服装到室内设计,那么复古风格的 ...

  3. Android 学习笔记 Service

    PS:前几篇的内容光是上代码了,也没有细细的讲解..感觉这样写很不好..因此还是多一些讲解吧... 学习内容: 1.了解Service... 2.Service的启动与停止.. 3.绑定与取消绑定Se ...

  4. sprint个人总结+读书博客

    读书感想:    第8章讲了需求分析,在我的日常软件编写中,肯定需要需求分析的,一个没有需求的软件,编写出来也没有什么意义,只能是丢在一个角落里发霉.需求有各种各样,要怎样才能满足客户的需求呢,那就要 ...

  5. Scrum4.0

    1.准备看板. 形式参考图4. 2.任务认领,并把认领人标注在看板上的任务标签上. 先由个人主动领任务,PM根据具体情况进行任务的平衡. 然后每个人都着手实现自己的任务. 3.为了团队合作愉快进展顺利 ...

  6. thread_Exchanger数据交换

    Exchanger 是一个同步辅助类,用于两个并发线程之间在一个同步点进行数据交换.  允许两个线程在某一个点进行数据交换. 可以视作双向的同步队列: 可应用于基因算法.流水线设计等场景 Exchan ...

  7. 2014 WAP校园招聘笔试题

    2014 WAP校园招聘笔试题 Problem's Link:   http://www.doc88.com/p-6751117015483.html WAP公司笔试题 We are planning ...

  8. 在C#后端处理一些结果然传给前端Javascript或是jQuery

    在C#后端处理一些结果然传给前端Javascript或是jQuery,以前Insus.NET有做过一个例子<把CS值传给JS使用 >http://www.cnblogs.com/insus ...

  9. Ubuntu 12.04下解决Tomcat自启动问题

    当我们安装好Tomcat使用后发现,每次启动都需要在终端中手动键入sudo /var/tomcat/bin/startup.sh,那么我们怎么解决这个问题呢 http://hovertree.com/ ...

  10. strtr对用户输入的敏感词汇进行过滤

    /** * 过滤用户输入的基本数据,防止script攻击 * * @access public * @return string */ function compile_str($str) { $ar ...