谷歌默认最小字体解决方案

参考文章:https://www.cnblogs.com/mfc-itblog/p/5669118.html

谷歌及谷歌内核的浏览器有默认的最小字体限制:12px,字体大小设置低于12px是不起作用的,也是按照12px显示。

解决方法:

span {
    font-size: 10px;
    -webkit-transform-origin-x:0;
    -webkit-transform: scale(0.84);
}

font-size设置成想要的大小(10px低于12px,谷歌内核浏览器是不起作用的,这里设置只是为了兼容IE),之后的利用CSS3的缩放,最终大小是 : 0.84 * 12px = 10.08px

这样设置后,span中的字体就会是10px了

-webkit-transform-origin-x:0    固定元素的位置,在x轴的0处

-webkit-transform:scale(0.84)  按照0.84比例缩放文字

原文地址:https://www.cnblogs.com/Aoobruce/p/8475446.html

时间: 2024-08-28 17:49:46

谷歌默认最小字体解决方案的相关文章

针对谷歌默认最小字体12px的正确解决方案 (css、html)

今天晨会,产品要求把以前12px的字体改小一点,我心想这有什么难的,就随口答应了.哪知,改css的时候,谷歌浏览器中font-size小于12px时,字体就不会再缩小了.当时我的第一反应就是会不会是其他css把字体覆盖了.结果看了半天也没发现.于是,只百度一伙了,结果还真让人大吃一惊:原来谷歌以及谷歌内核的浏览器在中文语言下最小字体只能是12px.不知道这算是一个bug还是谷歌人性化的设计.不管那么多了,反正要解决这个问题呀~既然这是一个经典的兼容性问题,一定有很多解决方法吧.让人吃惊的是,再百

针对谷歌默认最小字体12px的正确解决方案

利用css3的缩放,其最终大小就是:12px * 0.9(缩放比例) = 10.8px; 居然行得通.但回头一想,这么写的话,IE7 IE8会不会不兼容,还是12px呢?不出所料,果然不兼容.此时,又回头一想,要不再加个样式font-size?试了一下,果然兼容谷歌,IE7,IE8,代码如下:         .small-font{   font-size:12px;             -webkit-transform-origin-x: 0;            -webkit-t

【原创】CHROME 最小字体限制为12PX的终极解决方案

相信不少做网站的用户会有这样一个问题,Chrome 默认最小字体是12px(最新版英文也有此问题),这个是 Chrome 为了更好显示中文设计的,但是这样一来就会出现某些上标.下标字体过大,影响用户体验.鉴于本人发文不多,文采欠佳.就直接上解决方案了,希望能给以网友帮助. 先上图,然后上代码 -效果图 -源码 1 <!doctype html> 2 <html lang="zh"> 3 <head> 4 <meta charset="

关于谷歌浏览器最小字体12px的正确解决方法

今天晨会,产品要求把以前12px的字体改小一点,我心想这有什么难的,就随口答应了.哪知,改css的时候,谷歌浏览器中font-size小于12px时,字体就不会再缩小了.当时我的第一反应就是会不会是其他css把字体覆盖了.结果看了半天也没发现.于是,只百度一伙了,结果还真让人大吃一惊:原来谷歌以及谷歌内核的浏览器在中文语言下最小字体只能是12px.不知道这算是一个bug还是谷歌人性化的设计.不管那么多了,反正要解决这个问题呀~既然这是一个经典的兼容性问题,一定有很多解决方法吧.让人吃惊的是,再百

移动端最小字体限制测试

一.通过下面的代码在不同的浏览器里打开进行测试: <!DOCTYPE html> <html lang="en"> <head>      <meta charset="UTF-8">      <title>Document</title>      <meta name="viewport" content="width=device-width, use

谷歌Dremel即时数据分析解决方案

Hadoop技术已经无处不在.不管是好是坏,Hadoop已经成为大数据的代名词.短短几年间,Hadoop从一种边缘技术成为事实上的标准.看来,不仅现在Hadoop是企业大数据的标准,而且在未来,它的地位似乎一时难以动摇. 谷歌文件系统与MapReduce 我们先来探讨一下Hadoop的灵魂——MapReduce.面对数据的爆炸性增长,谷歌的工程师Jeff Dean和Sanjay Ghemawat架构并发布了两个开创性的系统:谷歌文件系统(GFS)和谷歌MapReduce(GMR).前者是一个出色

R绘图字体解决方案(转)

COS论坛里面经常会遇到的一个问题就是绘图时中文字体怎么解决.最初,一个流行的方法是使用family = "GB1",但一般这样做出来的图比较难看,而且并没有完全解决问题.后来发现了Cairo包,喜大普奔,但后来又发现它选字体的时候不太明确,也就是说我不知道怎样才能选中我想要的那个字体.再然后,Winston Chang写了extrafont包,功能很完善,但需要系统里面安装Ghostscript.我是懒人,不想花时间在配置Ghostscript上,于是写了一个叫做showtext的包

浏览器默认改变字体大小解决方案

前言 遇到个小坑,踩了一个多小时,真鸡儿难受. 是这样的,在移动端字体大小设置了16px,结果到 iphone5 上显示的有大有小,很奇怪.开始的时候还以为是P标签的原因,查了半天文档...最后才发现是浏览器的默认行为. 正文 在CSS中有  text-size-adjust  这样一个属性,这个属性允许我们控制将文本溢出算法应用到一些手机设备上.这个属性还没有写进标准,使用时必须加上前缀.如下: -webkit-text-size-adjust: ; text-size-adjust: ; -

网页默认的字体的设置方式

body{font-family :"Hiragino Sans GB","Hiragino Sans GB W3","Helvetica Neue","Microsoft YaHei",Helvetica,Arial,sans-serif} 或者 body { font-family:"Microsoft YaHei",Arial,Helvetica,sans-serif,"宋体";