css3消除锯齿的属性是什么
css3消除锯齿的属性是“font-smoothing”,它主要用来控制字体渲染时的平滑效果,可以对字体进行抗锯齿渲染。“font-smoothing”属性是非标准的,需要加“-webkit-”、“-moz-osx-”等前缀进行兼容性处理。
本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。
css3消除锯齿的属性是“font-smoothing”。
font-smoothing
属性主要用来控制字体渲染时的平滑效果,可以对字体进行抗锯齿渲染,使字体看起来更清晰舒服。
语法:
/* Keyword values */ font-smooth: auto; font-smooth: never; font-smooth: always; /* <length> value */ font-smooth: 2em;
这个样式的主要功能是对字体的锯齿进行调整。
font-smoothing是非标准的css渲染规则,由于不同操作系统对字体渲染不同,不同浏览器也有自己对样式的一套解释规则,所以这个css样式至今也没有加入web标准。
Webkit 实现了名为-webkit-font-smoothing的相似属性。这个属性仅在 Mac OS X/macOS 下生效。
none - 关闭字体平滑;展示有锯齿边缘的文字。
antialiased - 平滑像素级别的字体,而不是子像素。从亚像素渲染切换到黑暗背景上的浅色文本的抗锯齿使其看起来更轻。
subpixel-antialiased - 在大多数非视网膜显示器上,这将会提供最清晰的文字。
Firefox 实现了名为 -moz-osx-font-smoothing 的相似属性。这个属性仅在 Mac OS X / macOS 下生效。
auto - 允许浏览器选择字体平滑的优化方式,通常为grayscale。
grayscale - 用灰度抗锯齿渲染文本,而不是子像素。从亚像素渲染切换到黑暗背景上的浅色文本的抗锯齿使其看起来更轻。
inherit
unset
-webkit-font-smoothing 是webkit在自己的渲染引擎中增加的对字体抗锯齿的调整。这个调整在ios中表现比较明显,在windows中表现的不是很明显。
测试:放大5倍的效果
(学习视频分享:css视频教程)
以上就是css3消除锯齿的属性是什么的详细内容,更多请关注其它相关文章!
上一篇: 使用CSS实现九宫格布局的几种方法
下一篇: css3关系选择器有哪几种
推荐阅读
-
CSS3与动画有关的属性transition、animation、transform对比(史上最全版)
-
浅谈CSS3中display属性的Flex布局的方法
-
详解CSS3中强大的filter(滤镜)属性
-
浅析CSS3中鲜为人知的属性:-webkit-tap-highlight-color
-
在css3中background-clip属性与background-origin属性的用法介绍
-
CSS3线性渐变简单实现以及该属性在浏览器中的不同
-
CSS3利用text-shadow属性实现多种效果的文字样式展现方法
-
使用CSS3的appearance属性改变任何元素的浏览器默认风格
-
CSS3支持IE6, 7, and 8的边框border属性
-
CSS3的column-fill属性对齐列内容高度的用法详解