Google不支持小于12px字体 终极办法
每个浏览器厂商都会自己有设计的主观性,而这些出发点看似很好的却往往深深地伤害程序员。
1.需求
呈现指定为Google浏览器,字号为6-8px(为了打印细小的尺寸)。
2.探索
2.1 CSS HACK
搜索了N多的网页,都指向一个结果:
{
-webkit-text-size-adjust:none;
}
将以上代码放在文档的开始。。。
可,就是,不生效。。。结果就有不良——说话语气粗拙、脸红、眼瞪等一系列的反应。
2.2 CSS 3 的春天
刚好带了一本书,是讲CSS3的特性的,快速浏览了整本书之后,发现了一个特性:
div {
transform:scaleY(0.8);
}
— —对指定的标签进行缩放,比如,上述代码的意思就是,对div及其子元素(包括文本,也就包括字号)的高度(Y)放小到80%。
类似的,宽度放缩:scaleX(pre),整体放缩scale(pre)。
尝试之下,确实能够放缩。
可是,如果HTML是这样的话:
<div id="d1">your text</div>
<div id="d2">your text2</div>
那么在d1和d2之间将会出现很大的留白,怎么却掉这个留白呢?
两条铁律:
{
margin-top:-12px;
padding-bottom:-12px;
}
使用marin的负值,可以向指定方向移动外边距,即元素整体;
使用padding的负值,可以向指定的方向移动内边距,即撑大元素体;
之后,缩小的文本没哟发生变化,那么就达到了效果——在Google浏览器缩小字体,且像正常一样的执行。
3.总结
transform实际是计算机图形学的一个实现,有2D变换,3D变换等。
基础很重要,每一次努力都不会白费的~。
Google不支持小于12px字体 终极办法的更多相关文章
- CSS3 - chrome,傲游,360极速浏览器不支持小于12px的字号的解决办法
google流量器chrome,傲游,360极速浏览器都是基于webkit内核浏览器,默认不支持小于font-size小于12px 的字号,即定义font-size小于12px时会发现字体大小依然是1 ...
- 如何让谷歌浏览器支持小于12px的字体
CSS3有个新的属性transform,而我们用到的就是transform:scale() 书写一段代码 <body> <p>我是一个小于12PX的字体</p> & ...
- 谷歌浏览器支持小于12px的字体
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- 【css】怎么让Chrome支持小于12px 的文字
谷歌浏览器Chrome是Webkit的内核,有一个 -webkit-text-size-adjust 的私有 CSS 属性,通过它即可实现字体大小不随终端设备或浏览器影响.CSS样式定义如下:-web ...
- 使用css怎么让谷歌支持小于12px的文字比如10px
1.小于12px的字体,如果内容固定,可以将内容切除做图片,没有兼容问题. 2.-webkit-text-size-adjust:none;老版本谷歌,27版本之后无用 3.-webkit-trans ...
- Chrome不支持css字体小于12px的解决办法
我们先来看个效果图(chrome下): 从上面的图可以很明显地看出Chrome下css设置字体大小为12px及以下时,显示的都是一样大小,都是默认12px: 那么网上有一个方法就是给当前样式添加Chr ...
- Chrome谷歌浏览器下不支持css字体小于12px的解决办法
先来看下 ie.火狐.谷歌浏览器下各个字体显示情况 ie下: 火狐下: 谷歌下: 从上面的图可以很明显看出谷歌下 css设置字体大小为12px及以下时,显示都是一样大小,都是默认12px; 那么网上一 ...
- 让谷歌浏览器 chrome 支持小于12px的字体
webkit的私有属性:{-webkit-text-size-adjust:none;} 但是,在最新版的谷歌里.已经不在支持这个属性啦. 用css3的transform:scale()缩放大小,但是 ...
- 移动端 设置 小于12px 字体 初探
1.移动端字号规范 2. 百度字号调研 3. 绕过12px 限制 4. 缩放 5. chrome 字号
随机推荐
- Protocol Buffers介绍
基本概念 Protocol Buffers(以下简称PB)是一种独立于语言.独立于开发平台.可扩展的序列化数据结构框架,它常常被用在通信.数据序列化保存等方面. PB是一种敏捷.高效.自动化的用于对数 ...
- PHP使用CURL上传|下载文件
CURL下载文件 /** * @param string $img_url 下载文件地址 * @param string $save_path 下载文件保存目录 * @param string $fi ...
- HDOj 1010 DFS优化
#include<cstdio> #include<cstring> ]={,,,-}; ]={,,-,}; ][]; int x1,y1,x2,y2; int step; i ...
- Tornaod框架
Tornado 是 FriendFeed 使用的可扩展的非阻塞式 web 服务器及其相关工具的开源版本.这个 Web 框架看起来有些像web.py 或者 Google 的 webapp,不过为了能有效 ...
- PHPNG (next generation)
PHPNG (next generation) This page gives short information about development state of a new PHP branc ...
- TCP/IP详解学习笔记(5)-- ICMP:internet 控制报文协议
1.概述 ICMP是(Internet Control Message Protocol)Internet控制报文协议.它是TCP/IP协议族的一个子协议,用于在IP主机.路由器之间传递控制 ...
- TestPointer
C++ Code 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849 ...
- Java for LeetCode 152 Maximum Product Subarray
Find the contiguous subarray within an array (containing at least one number) which has the largest ...
- AngularJS学习笔记1
简介 AngularJS 是一个为动态WEB应用设计的结构框架,提供给大家一种新的开发应用方式,这种方式可以让你扩展HTML的语法,以弥补在构建动态WEB应用时静态文本的不足,从而在web应用程序中使 ...
- WINDOWS xp用户账户怎么没了怎么办?
这是因为系统的一个默认设置!新建用户会把管理员用户隐藏!只是修改了里面的注册表!在运行(windows徽标+R)里输入“regedit”可以打开注册表编辑器,定位到“HKEY_LOCAL_MACHIN ...