问题：为什么不建议将 font-size 设置为 12px 以下？如果一定要设置为 12px 以下要怎么做？

先看看把 font-size 设置为 12px 以下时的效果：（浏览器为 Chrome 52）

在其他浏览器上效果却不一样：

因为 Chrome 这款任性的浏览器做了如下限制：

1. font-size 有一个最小值 12px（不同操作系统、不同语言可能限制不一样），低于 12px 的，一律按 12px 显示。理由是 Chrome 认为低于 12px 的中文对人类是不友好的。

2. 但是允许你把 font-size 设置为 0.

3. 这个 12px 的限制用户是可以自行调整的，进入 chrome://settings/fonts 设置，滚动到最下方你就可以调整 12px 为其他值。

如果我一定要设置小于 12px 的字体怎么办？

1. Chrome 29 版本之前，你可以使用 `-webkit-text-size-adjust: none;` 来解除这个限制。29 版本后，就不能这样做了。

2. 你可以先设置 12px，然后使用 transform: scale(0.833333) 将元素缩小，效果跟 10px 很接近。不过要注意的是，transform: scale 出了缩小 font-size，也会缩小其他一些属性，需要多测试。

好了，今天的分享就到这里，想要更多交流可以加我们的前端交流3群：222459918，目前已有四百多人。

为什么不建议将 font-size 设置为 12px 以下？如果一定要设置为 12px 以下要怎么做？的更多相关文章

  1. GetPropInfo Font Size

    设置font size,遍历所有控件,有的控件没有font属性,所以要用GetPropInfo判断 if (GetPropInfo(cmp, "font")) function G ...

  2. hiho #1288 微软2016.4校招笔试题 Font Size

    #1288 : Font Size 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 Steven loves reading book on his phone. The ...

  3. LaTeX ：font size 修改字体大小的几种方式

    调整字体大小的几种方式,大小依次增大,具体如下: \tiny \scriptsize \footnotesize \small \normalsize \large \Large \LARGE \hu ...

  4. unity UGUI text font size对性能影响较大

    Font Size对ugui text的性能影响非常大. <Cube Duck Run>在itouch5上测试是很流畅的,但是在iphone5上测试,在game over后显示历史最高分时 ...

  5. Markdown更改字体、颜色、大小，设置文字背景色，调整图片大小设置居中，插入表格等方法

    Markdown 通过简单标记语法,使普通文本内容具有一定格式.但它本身不支持修改字体.字号与颜色等功能的. 一.更改字体大小.颜色.更改字体 Markdown语法 <font face=&qu ...

  6. 【配置】检测到在集成的托管管道模式下不适用的ASP.NET设置的解决方法（非简单设置为【经典】模式）。

      ×   检测到在集成的托管管道模式下不适用的ASP.NET设置的解决方法(非简单设置为[经典]模式). 我们将ASP.NET程序从IIS6移植到IIS7,可能运行提示以下错误: HTTP 错误 5 ...

  7. redis密码设置、访问权限控制等安全设置

    redis作为一个高速数据库,在互联网上,必须有对应的安全机制来进行保护,方法有2,如下. 1.比较安全的办法是采用绑定IP的方式来进行控制.  请在redis.conf文件找到如下配置 # If y ...

  8. 【转】检测到在集成的托管管道模式下不适用的ASP.NET设置的解决方法（非简单设置为【经典】模式）。

    检测到在集成的托管管道模式下不适用的ASP.NET设置的解决方法(非简单设置为[经典]模式). 我们将ASP.NET程序从IIS6移植到IIS7,可能运行提示以下错误: HTTP 错误 500.23 ...

  9. 关于LinearLayout设置权重后width或height不设置0dp的影响说明

    摘要 平时没那么注意LinearLayout布局时权重的问题,设置了权重属性后,通常建议将width或height的属性值设置为0dp,有时候设置权重后,还是习惯将width或height的属性设置为 ...

  10. APUE学习之三个特殊位 设置用户ID（set-user-ID），设置组ID（set-group-ID），sticky

    设置用户ID(set-user-ID),设置组ID(set-group-ID),sticky   set-user-ID: SUID      当文件的该位有设置时,表示当该文件被执行时,程序具有文件 ...

随机推荐

  1. python修改镜像源

    pip升级:python -m pip install --upgrade pip https://www.cnblogs.com/andy9468/p/10319442.html 1.在命令中临时修 ...

  2. mysql 删除表

    删除表 DROP TABLE 表名;

  3. python之__setattr__常见问题

    #__setattr__ class Foo(object): def set(self,k,v): pass def __setattr__(self, key, value): print(key ...

  4. 如何确定selenium ID元素是否查找正确

    编写脚本时,如何确定通过id查找的id是否真实存在,点击css,然后输入#(代表id)id名,如#kd,回车之后,能返回结果,便代表存在.

  5. CCF地铁修建

    问题描述 A市有n个交通枢纽,其中1号和n号非常重要,为了加强运输能力,A市决定在1号到n号枢纽间修建一条地铁. 地铁由很多段隧道组成,每段隧道连接两个交通枢纽.经过勘探,有m段隧道作为候选,两个交通 ...

  6. vim tab设置为4个空格

    为了vim更好的支持python写代码,修改tab默认4个空格有两种设置方法: 1. vim /etc/vimrc 1 set ts=4 2 set sw=4 2. vim /etc/vimrc 1 ...

  7. .net webform 把word转为html

    首先添加引用 引用命名空间 using Microsoft.Office.Interop.Word; using System; using System.Collections.Generic; u ...

  8. 528. Random Pick with Weight

    1. 问题 给定一个权重数组w,w[i]表示下标i的权重,根据权重从数组中随机抽取下标. 2. 思路 这道题相当于 497. Random Point in Non-overlapping Recta ...

  9. 对Java平台的理解

    1)  Java是一种面向对象的语言(封装,继承,多态),最显著的特性有两个方面: ----书写一次,到处运行(Write once,run anywhere) 能够非常容易的获得跨平台的能力 --- ...

  10. SQL学习笔记之MySQL查询练习2

    (网络搜集) 0x00 数据准备 CREATE TABLE students (sno ) NOT NULL, sname ) NOT NULL, ssex ) NOT NULL, sbirthday ...