CSS3有个新的属性transform，而我们用到的就是transform:scale()

书写一段代码

<body>

   <p>我是一个小于12PX的字体</p>

</body>

定义样式

body,p{ margin:; padding:}

p{font-size:10px;}

放在浏览器预览。会发现最新版谷歌已经不在支持。还是12px，如图：

所以我们就用到了

-webkit-transform:scale(0.8);   //0.8位缩放倍数，具体自己根据实际需求修改

修改后样式为

body,p{ margin:; padding:}

p{font-size:10px;}

span{-webkit-transform:scale(0.8); display:inline-block}

实际上，是以为-webkit-transform:scale(0.8);只能缩放可以定义宽高的元素，而span是行内元素，不支持缩放，所以定义 display:inline-block，

放在谷歌浏览器里，运行一下会发现支持字体变小了。如图：

如何让谷歌浏览器支持小于12px的字体的更多相关文章

  1. 谷歌浏览器支持小于12px的字体

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  2. 让谷歌浏览器 chrome 支持小于12px的字体

    webkit的私有属性:{-webkit-text-size-adjust:none;} 但是,在最新版的谷歌里.已经不在支持这个属性啦. 用css3的transform:scale()缩放大小,但是 ...

  3. 小于12px的字体大小在Chrome中不起作用

    今天遇见一个小问题,让人挺郁闷的,在Chrome浏览器中无法把字体变成12px以下.网上搜索以下,发现无论中文英文数字在网页中CSS设置小于12px后各大浏览器均支持,在谷歌chrome浏览器不支持解 ...

  4. 【css】怎么让Chrome支持小于12px 的文字

    谷歌浏览器Chrome是Webkit的内核,有一个 -webkit-text-size-adjust 的私有 CSS 属性,通过它即可实现字体大小不随终端设备或浏览器影响.CSS样式定义如下:-web ...

  5. 设置小于12px的字体

    .small-font{   font-size:12px;             -webkit-transform-origin-x: 0;            -webkit-transfo ...

  6. 使用css怎么让谷歌支持小于12px的文字比如10px

    1.小于12px的字体,如果内容固定,可以将内容切除做图片,没有兼容问题. 2.-webkit-text-size-adjust:none;老版本谷歌,27版本之后无用 3.-webkit-trans ...

  7. CSS3 - chrome，傲游，360极速浏览器不支持小于12px的字号的解决办法

    google流量器chrome,傲游,360极速浏览器都是基于webkit内核浏览器,默认不支持小于font-size小于12px 的字号,即定义font-size小于12px时会发现字体大小依然是1 ...

  8. Google不支持小于12px字体 终极办法

    每个浏览器厂商都会自己有设计的主观性,而这些出发点看似很好的却往往深深地伤害程序员. 1.需求 呈现指定为Google浏览器,字号为6-8px(为了打印细小的尺寸). 2.探索 2.1 CSS HAC ...

  9. 解决Chrome谷歌浏览器不支持CSS设置小于12px的文字

    在最新版的谷歌里.已经不在支持这个属性啦 谷歌浏览器Chrome是Webkit的内核,有一个 -webkit-text-size-adjust 的私有 CSS 属性,通过它即 可实现字体大小不随终端设 ...

随机推荐

  1. 解决npm报错：Module build failed: TypeError: this.getResolve is not a function

    1.sass-loader的版本过高导致的编译错误,当前最高版本是8.x,需要退回到7.3.1 运行: npm uninstall sass-loader --save-dev(卸载当前版本) npm ...

  2. java设计模式3.建造者模式、原型模式

    建造者模式 一个产品常有不同的组成部分作为产品的零件,有些情况下,一个对象会有一些重要的性质,在它们没有恰当的值之前,对象不能作为一个完整的产品使用,有些时候,一个对象的一些性质必须按照某个顺序赋值才 ...

  3. 一位996、CRUD开发者的一天

    记一笔流水账 今天我打算记一笔流水账,主要记录我的一天中干的事情,并思考效率低下的原因,同时分析一些可用的解决方案. 清早·开始做计划 早上六点四十,被梦想唤醒,然后看一会书,吃早餐,送娃上学. 九点 ...

  4. MARTIN FOWLER谈敏捷开发

    转自:http://www.scrumcn.com/agile/scrum-knowledge-library/agile-development.html#tab-id-9 每个人都在谈论敏捷开发( ...

  5. SCRUM起源

    http://www.scrumcn.com/agile/scrum-knowledge-library/scrum.html#tab-id-3 Scrum的原始含义 Scrum原始含义是指英式橄榄球 ...

  6. ZOJ - 3870-Team Formation二进制，位运算

    传送门:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3870 题意:找出一个数列中的两个数,所有通过异或和使得结果同时大于 ...

  7. 1014 装箱问题 CODE[VS]

    1014 装箱问题 2001年NOIP全国联赛普及组  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 黄金 Gold 题解  查看运行结果     题目描述 Descripti ...

  8. java hdu A+B for Input-Output Practice (IV)

    A+B for Input-Output Practice (IV) Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/327 ...

  9. JSON和Map，List，String互相转换

    1)Map 和 JSON 互相转换 Map 转成 JSON Map<String, List> map = new HashMap<>(); map.put("xAx ...

  10. [大数据学习研究]1.在Mac上利用VirtualBox搭建本地虚拟机环境

    1. 大数据和Hadoop 研究学习大数据,自然要从Hadoop开始. Hadoop不是一个简单的软件,而是有一些列软件形成的生态,其核心思想来自Google当初发布的三篇论文,后来做了开源的实现, ...