字体渲染技术(字体抗锯齿技术) -webkit-font-smoothing: antialiased;
1、-webkit-font-smoothing控制的字体渲染只对MacOS的webkit有效。所以,你在MacOS测试环境下面设置-webkit-font-smoothing时,只要你不把它设置为none,怎么好看就设置为什么属性,反正这个属性仅仅是面向MacOS,不会在其他上下文中出岔子的(除了none的情形)。
2、前端控制字体渲染的接口非常匮乏,如果可能,尽可能的控制输出的字体,而非控制字体渲染。
3、以下测试则会表明,-webkit-font-smoothing在MacOS上才有效果。
① Windows
测试环境:Win7 Pro + Chrome:
结论:Windows系统上-webkit-font-smoothing属性不造成区别。
② ios
测试环境:iPad Air + ios7 + Safari
(ios上没有Hiragino Sans GB,不要被标签误导了!)
结论:ios上,修改-webkit-font-smoothing属性,结果是:
· -webkit-font-smoothing:none; 无抗锯齿
· -webkit-font-smoothing:antialiased | subpixel-antianliased | default; 灰度平滑
③ MacOS
测试环境:MBP + Safari:
结论:ios上,修改-webkit-font-smoothing属性,结果是:
· -webkit-font-smoothing:none; 无抗锯齿
· -webkit-font-smoothing:subpixel-antialiased | default; 次像素平滑
· -webkit-font-smoothing:antialiased; 灰度平滑
4、字体抗锯齿技术
字体抗锯齿技术可以分为如下几类:
· 黑白渲染:现在已经绝迹
·灰度渲染:常用语Android和ios等移动设备
·次像素平滑:常见于Mac OS 和 MacType For Windows
·ClearType:黑白渲染和次像素平滑的折中。WinXP内置,默认关闭;win7以上默认打开
理想形状:黑白渲染;灰度渲染。
次像素平滑技术原理,从右往左看,注意到一个pixel里的渐变。
5、从不同平台浏览器字体渲染对比附的图可见端倪:
6、以下表格是我综合多方资料的结果,欢迎纠错:
来源:https://segmentfault.com/q/1010000000467910/a-1020000000468107
字体渲染技术(字体抗锯齿技术) -webkit-font-smoothing: antialiased;的更多相关文章
- CSS3中字体平滑处理和抗锯齿渲染
在围观Drupal官方主题的时候,发现了一个有意思的非标准CSS选择器-webkit-font-smoothing,于是上手把玩了一番.如何使用css3字体平滑显示呢 要知道,W3C对CSS中字体的抗 ...
- 回击MLAA:NVIDIA FXAA抗锯齿性能实測、画质对照
PC游戏玩家肯定会对各式各样的AA抗锯齿技术很熟悉,而今天本文的主角就是NVIDIA今年才推出的新型抗锯齿技术"FXAA". FXAA在某种程度上有些类似于AMD之前宣传的MLAA ...
- Unity3D学习(七):Unity多重采样抗锯齿设置无效的解决办法
前言 学习Shader的过程中发现模型锯齿严重,于是去Edit--Project Settings--Quality选项下将反锯齿设置为了8X Multi Sampling.结果没有任何改变,如图: ...
- SSE图像算法优化系列二十四: 基于形态学的图像后期抗锯齿算法--MLAA优化研究。
偶尔看到这样的一个算法,觉得还是蛮有意思的,花了将近10天多的时间研究了下相关代码. 以下为百度的结果:MLAA全称Morphological Antialiasing,意为形态抗锯齿是AMD推出的完 ...
- CSS3属性-webkit-font-smoothing字体抗锯齿渲染
对字体进行抗锯齿渲染可以使字体看起来会更清晰舒服.在图标字体成为一种趋势的今天,抗锯齿渲染使用也越来越多. font-smoothing是非标准的CSS定义.它被列入标准规范的草案中,后由于某些原因从 ...
- Linux 下 netbeans 字体抗锯齿正解
转自:http://leenjewel.blog.163.com/blog/static/601937922010124444051/ 说来这个不难,主要是我看网上有的写的不是很明确,甚至有的写的根本 ...
- CSS3中设置字体的抗锯齿或光滑度的属性
刚刚接触前端开发,对于-webkit-font-smoothing: antialiased; 这个属性不了解.上网查找了一些资料. 总结一下: -webkit-font-smoothing : ...
- Cufon在渲染网页字体你不知道的事
清单 1. 无效的 font-family 字体指定 <style> .introduction { font-family:'Baroque Script';} </style&g ...
- Qt 2D绘图之二:抗锯齿渲染和坐标系统
一.抗锯齿渲染 1.1 逻辑绘图 图形基元的大小(宽度和高度)始终与其数学模型相对应,下图示意了忽略其渲染时使用的画笔的宽度的样子. 1.2 物理绘图(默认情况) 在默认的情况下,绘制会产生锯齿,并且 ...
随机推荐
- linux下的时间管理概述
2017/6/21 时间这一概念在生活中至关重要,而在操作系统中也同样重要,其在系统中的功能绝不仅仅是给用户提供时间这么简单,内核的许多机制都依赖于时间子系统.但凡是要在某个精确的时间执行某个事件,必 ...
- java中的静态分派和动态分派
多态是java的基本特征之一,多态即一个对象具有多种形态(多种表达形式,猴子是动物的一种的表现形式),例如:子类是父类的一种形态. 当方法重载时,就会涉及到多态. 1:在重载时是通过参数的静态类型,而 ...
- 使用jQuery为文本框、单选框、多选框、下拉框、下拉多选框设值及返回值的处理
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- STL: fill,fill_n,generate,generate_n
fill Assigns the same new value to every element in a specified range. template<class ForwardIter ...
- [React-Native]入门(Hello World)
(1)需要一台Mac(OSX),这个是前提,建议还是入手一本啦. (2)在Mac上安装Xcode,建议Xcode 6.3以上版本 (3)安装node.js:https://nodejs.org/dow ...
- 斩获新知——记一次reverse的实现过程
最近学习C++,在实现reverse模板函数的时候,从一个小问题开始,在对这个问题的旁敲侧击当中带起了更多疑惑,顺藤摸瓜之后,尽管没有将诸多问题完美解答,但整个过程下来却也似有所获.最初的问题从使用C ...
- PKU 1321 棋盘问题(搜索+剪枝)
#include<iostream> #include<cstring> using namespace std; ],ans; ][]; void dfs(int i) { ...
- 记一次ZOOKEEPER集群超时问题分析
CDH安装的ZK,三个节点,基本都是默认配置,一直用得正常,今天出现问题,客户端连接超时6倍时长,默认最大会话超时时间是一分钟.原因分析:1.首先要确认网络正确.确认时钟同步.2.查看现有的配置,基本 ...
- Java GC随笔
最近发生了一些C#程序运行时的一些问题,发现是GC导致的问题,然后稍微研究了一下GC,因为知道Java的GC要比.NET稍微复杂一点,所以我觉得要是能弄懂Java的GC的原理,对.NET的GC的理解也 ...
- 【c++ primer, 5e】定义类相关的非成员函数
练习 7.6 & 7.7 #include <iostream> #include <string> using namespace std; // Sales_dat ...