文本渲染 | text-rendering (Scalable Vector Graphics) - CSS 中文开发手册
该text-renderingCSS属性提供信息,以什么来优化渲染文本时的渲染引擎。
浏览器在速度,可读性和几何精度之间进行权衡。
/* Keyword values */ text-rendering: auto; text-rendering: optimizeSpeed; text-rendering: optimizeLegibility; text-rendering: geometricPrecision; /* Global values */ text-rendering: inherit; text-rendering: initial; text-rendering: unset;
该text-rendering属性是一个没有在CSS标准中定义的SVG属性。但是,Gecko和WebKit浏览器允许您将此属性应用于Windows,Mac OS X和Linux上的HTML和XML内容。
一个非常明显的效果是optimizeLegibility,对于某些字体(例如,Microsoft的Calibri,Candara,Constantia和Corbel,或DejaVu字体系列),文本中的连字(ff,fi,fl等)文本小于20px 。
Initial value | auto |
---|---|
应用对象 | text elements |
是否可继承 | yes |
媒体 | visual |
计算值 | as specified |
动画类型 | discrete |
规范顺序 | the unique non-ambiguous order defined by the formal grammar |
语法
值
auto浏览器在绘制文本的同时,对于何时优化速度,可读性和几何精度进行了有根据的猜测。有关浏览器解释此值的差异,请参阅兼容性表。
optimizeSpeed在绘制文本时,浏览器强调渲染速度超过可读性和几何精度。它禁用字距和连字。
optimizeLegibility浏览器强调渲染速度和几何精度的易读性。这使得字距和可选的连字。