【css】怎么让Chrome支持小于12px 的文字
谷歌浏览器Chrome是Webkit的内核,有一个 -webkit-text-size-adjust 的私有 CSS 属性,通过它即可实现字体大小不随终端设备或浏览器影响。
CSS样式定义如下:
-webkit-text-size-adjust:none;
但是在最新版的谷歌里。已经不在支持这个属性啦,需要通过css3的transform来解决,方法如下:
| css部分 | html布局 |
|
body,p{ margin:0; padding:0;} |
<p><span id="span1">我是一个小于12PX的字体</span></p> |
解释:
1.{webkit-transform:scale(0.8); display:inline-block} //0.8位缩放倍数,具体自己根据实际需求修改,只能缩放可以定义宽高的元素,而span是行内元素,
为什么定义 display:inline-block而不是 display:block?转为block就独占一行啦,所以转换为inline-block
2.{-o-transform:scale(1);}opera现在最新版也是webkit内核,新版本的opera,本来就是10px的字体了。
作者:smile.轉角
QQ:493177502
【css】怎么让Chrome支持小于12px 的文字的更多相关文章
- 使用css怎么让谷歌支持小于12px的文字比如10px
1.小于12px的字体,如果内容固定,可以将内容切除做图片,没有兼容问题. 2.-webkit-text-size-adjust:none;老版本谷歌,27版本之后无用 3.-webkit-trans ...
- 让谷歌浏览器 chrome 支持小于12px的字体
webkit的私有属性:{-webkit-text-size-adjust:none;} 但是,在最新版的谷歌里.已经不在支持这个属性啦. 用css3的transform:scale()缩放大小,但是 ...
- 解决Chrome谷歌浏览器不支持CSS设置小于12px的文字
在最新版的谷歌里.已经不在支持这个属性啦 谷歌浏览器Chrome是Webkit的内核,有一个 -webkit-text-size-adjust 的私有 CSS 属性,通过它即 可实现字体大小不随终端设 ...
- CSS3 - chrome,傲游,360极速浏览器不支持小于12px的字号的解决办法
google流量器chrome,傲游,360极速浏览器都是基于webkit内核浏览器,默认不支持小于font-size小于12px 的字号,即定义font-size小于12px时会发现字体大小依然是1 ...
- [Chrome](CSS) 解决Chrome font-size 小于 12px 无效
Chrome中 font-size 小于 12px 会失效. 解决的办法一种是: -webkit-text-size-adjust:none; (但是Chrome27之后取消了支持) 利用CSS3的缩 ...
- 解决CSS小于12px的文字在谷歌浏览器显示问题
做前端设计的人经常要接触CSS方面的问题,估计有不少人会遇到Chrome谷歌浏览器中CSS设置字体小于12px显示不正常,强创网络在做magento模板过程中就遇到了,起初以为是自己写的CSS的问题, ...
- 如何让谷歌浏览器支持小于12px的字体
CSS3有个新的属性transform,而我们用到的就是transform:scale() 书写一段代码 <body> <p>我是一个小于12PX的字体</p> & ...
- 谷歌浏览器支持小于12px的字体
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- Google不支持小于12px字体 终极办法
每个浏览器厂商都会自己有设计的主观性,而这些出发点看似很好的却往往深深地伤害程序员. 1.需求 呈现指定为Google浏览器,字号为6-8px(为了打印细小的尺寸). 2.探索 2.1 CSS HAC ...
随机推荐
- ACM ICPC 2017 Warmup Contest 9 I
I. Older Brother Your older brother is an amateur mathematician with lots of experience. However, hi ...
- window.requestAnimationFrame与Tween.js配合使用实现动画缓动效果
window.requestAnimationFrame 概述 window.requestAnimationFrame()这个方法是用来在页面重绘之前,通知浏览器调用一个指定的函数,以满足开发者操作 ...
- 求二叉树第n层节点数
在知乎看到今日头条的一个面试题“求二叉树第n层节点数”:https://zhuanlan.zhihu.com/p/25671699,想到了这样一个解法,欢迎大家交流 我的解法采用递归的思想,从0层开始 ...
- ORACLE导入大量数据的两种方式比较
不管是开发还是测试,工作中经常需要去批量新增测试数据,但是大量数据的新增速度有时候让我们苦不堪言,下面通过两种方式完成oracle数据的批量新增,比较两种方式的效率. 第一种方式:采用工具导入sql文 ...
- ERP结账不自动清台的解决办法
1. 2. 完成以上设置即可
- iOS In-App Purchase(IAP)内购服务端二次验证注意事项
前端iOS完成对应的商品购买之后,会得到一个Transaction(交易)的数据结构指针,后端实际上只需要这个结构内的一个东西,那就是 transaction.transactionReceipt. ...
- JaveScript 中使用 XSLT转换XML文档
我们经常将数据存储在XML 中,在展示的时候需要转换为其它的形式,这里介绍使用XSLT 对XML数据进行转换. 要学习XSLT对XML的转换,需要先了解三个文件. 第一个是存储数据的XML文件:emp ...
- Python 面向对象的特性2-----继承
面向对象的三大特性 1.封装 根据职责将属性和方法封装到一个抽象的类中,然后类创建一个实实在在的对象,有了对象以后,就可以访问到对象内部的属性,或者让对象来调用一个已经封装好的方法. 2.继承 实现代 ...
- Flask中使用cookie和session
Flask中使用cookie和session 设置cookie from flask import Flask,Response app = Flask(__name__) @app.route('/ ...
- JavaSE: Java 5 新特性
Java5新特性 1.Java 语言 1.1 Generics 1.2 foreach 1.3 自动拆箱装箱 1.4 enum 1.5 可变参数 varargs 1.6 static import 1 ...