chrome浏览器font-size<12px无效解决办法
当样式设定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的默认配置了,一般应用下面的代码就能在全局生效了:
但是这样设置之后会有一个问题,就是当你放大网页时,一般情况下字体也会随着变大,而设置了以上代码后,字体只会显示你当前设置的字体大小,不会随着网页放大而变大了,这样对有需要放大网页观看的用户造成了不好的用户体验,所以不建议全局应用该属性,而是在需要的情况单独使用就好了。
在中文版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无效解决办法的更多相关文章
- chrome浏览器首页被hao123劫持解决办法
在chrome浏览器设置里面将新标签页地址改为www.baidu.com, 不过一般来说这个办法完全没用,因为我们面对的是史无前例的大流氓. 查看桌面chrome的快捷方式是否被篡改.右键快捷方式,点 ...
- Chrome浏览器所有页面全部崩溃解决办法。
今晚写代码的时候更新了一下Chrome,结果打开所有网页都提示 喔唷 崩溃了,而且找到c盘内没有bd0001.sys文件,电脑内也无任何百度系的软件,此解决办法pass. 折腾了半天从google中找 ...
- Chrome下font-size小于12px的解决办法
自从Chorme取消了-webkit-text-size-adjust,这个问题又变得令人烦恼起来. 好在我们可以利用-webkit-transform这个私有属性. .box{ -webkit-tr ...
- 中文版Chrome浏览器不支持12px以下字体的解决方案
中文版Chrome浏览器不支持12px以下字体的解决方案 Chrome 27之前的中文版桌面浏览器会默认设定页面的最小字号是12px,英文版则没有限制,主要是因为chrome认为汉字小于12px就会增 ...
- Chrome浏览器 js 关闭窗口失效解决方法
//获取元素ID var DelHtml = document.getElementById("imgdel"); //alert(DelHtml); //添加点击事件 DelHt ...
- iOS 发布证书提示 此证书的签发者无效 解决办法
1. 打开钥匙串 查看发布证书 都是提示 此证书的签发者无效 解决办法 : 2. 到了 第 4 步骤 再去 查看 发布证书 就会 显示 此证书有效 3. 如果还不可以 就 把 Apple W ...
- IDEA Spring-boot-devTools 无效解决办法二
转载地址:Intellij IDEA 使用Spring-boot-devTools无效解决办法 相信大部分使用Intellij的同学都会遇到这个问题,即使项目使用了spring-boot-devtoo ...
- HTTP 错误 500.19 请求的页面的相关配置数据无效 解决办法
"HTTP 错误 500.19 请求的页面的相关配置数据无效" 解决办法 HTTP 错误 500.19 - Internal Server Error无法访问请求的页面,因为该 ...
- 在vue中使用 layui框架中的form.render()无效解决办法
下面简单介绍在vue中使用 layui框架中的form.render()无效解决办法. 原文地址:小时刻个人技术博客 > http://small.aiweimeng.top/index.php ...
随机推荐
- 【JVM学习笔记一】JVM内存分布
Overview 学习JVM首先需要了解一下JVM管理的内存是如何分布的,在看了<深入理解Java虚拟机>和一些博文之后,我准备自己记录一下学习的过程. 下图是JVM中运行时数据区的大致示 ...
- 分享27款最佳的复古风格 WordPress 主题
WordPress 作为最流行的博客系统,插件众多,易于扩充功能.安装和使用都非常方便,而且有许多第三方开发的免费模板,安装方式简单易用. 复古风格可以应用于任何东西,从服装到室内设计,那么复古风格的 ...
- Android 学习笔记 Service
PS:前几篇的内容光是上代码了,也没有细细的讲解..感觉这样写很不好..因此还是多一些讲解吧... 学习内容: 1.了解Service... 2.Service的启动与停止.. 3.绑定与取消绑定Se ...
- sprint个人总结+读书博客
读书感想: 第8章讲了需求分析,在我的日常软件编写中,肯定需要需求分析的,一个没有需求的软件,编写出来也没有什么意义,只能是丢在一个角落里发霉.需求有各种各样,要怎样才能满足客户的需求呢,那就要 ...
- Scrum4.0
1.准备看板. 形式参考图4. 2.任务认领,并把认领人标注在看板上的任务标签上. 先由个人主动领任务,PM根据具体情况进行任务的平衡. 然后每个人都着手实现自己的任务. 3.为了团队合作愉快进展顺利 ...
- thread_Exchanger数据交换
Exchanger 是一个同步辅助类,用于两个并发线程之间在一个同步点进行数据交换. 允许两个线程在某一个点进行数据交换. 可以视作双向的同步队列: 可应用于基因算法.流水线设计等场景 Exchan ...
- 2014 WAP校园招聘笔试题
2014 WAP校园招聘笔试题 Problem's Link: http://www.doc88.com/p-6751117015483.html WAP公司笔试题 We are planning ...
- 在C#后端处理一些结果然传给前端Javascript或是jQuery
在C#后端处理一些结果然传给前端Javascript或是jQuery,以前Insus.NET有做过一个例子<把CS值传给JS使用 >http://www.cnblogs.com/insus ...
- Ubuntu 12.04下解决Tomcat自启动问题
当我们安装好Tomcat使用后发现,每次启动都需要在终端中手动键入sudo /var/tomcat/bin/startup.sh,那么我们怎么解决这个问题呢 http://hovertree.com/ ...
- strtr对用户输入的敏感词汇进行过滤
/** * 过滤用户输入的基本数据,防止script攻击 * * @access public * @return string */ function compile_str($str) { $ar ...