网页字体更清晰的css用什么？

对字体进行抗锯齿渲染可以使字体看起来会更清晰舒服。

在线demo： https://jsfiddle.net/zhangchi/rxmyq1L7/6/

font-smoothing是非标准的CSS定义。它被列入标准规范的草案中，后由于某些原因从web标准中被移除了。

但是，我们可以用以下两种定义进行抗锯齿渲染

webkit-font-smoothing: antialiased; /*chrome、safari*/ -moz-osx-font-smoothing: grayscale;/*firefox*/

（1）Webkit在自己的引擎中支持了这一效果。

webkit-font-smoothing它有三个属性值：
**none：**对低像素的文本比较好
subpixel-antialiased：默认值
antialiased：抗锯齿很好

例子：

body{ -webkit-font-smoothing: antialiased; }

这个属性可以使页面上的字体抗锯齿,使用后字体看起来会更清晰。加上之后就顿时感觉页面小清晰了。

（2）Gecko也推出了自己的抗锯齿效果的非标定义。

moz-osx-font-smoothing: inherit | grayscale;这个属性也是更清晰的作用。

例子：

.icon { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

网页字体更清晰的css用什么？相关推荐

HTML字体怎么显示,教你如何用CSS来控制网页字体的显示样式
教你如何用CSS来控制网页字体的显示样式更新时间:2007年02月27日 00:00:00 作者: HTML对于<font>内容</font>卷标只有: <font ...
html字体自动放大,让用户自己控制网页字体的大小的css书写方法
让用户自己控制网页字体的大小的css书写方法更新时间:2007年09月18日 20:31:41 作者: 现在国内绝大多数的站点都用CSS把字体大小设定为12px,像素虽然也是相对尺寸单位,但只是 ...
css 谷歌字体加载,使用谷歌网页字体无限制的添加字体到您的网站
很长一段时间,网站的开发受到影响,因为他们的资源,他们只能使用少数几种字体.但是,现在谷歌推出新的Web服务"谷歌网页字体".该服务允许您使用不同的字体在您的网站从谷歌的可能性.使 ...
CSS 网页字体最佳实践
一般在网页的字体设置中,可以将字体分类三类: 系统字体:使用系统自带的字体兜底字体:当系统字体无法正常使用,而兜底的字体 Emoji 字体:显示网页中的表情字体为了满足不同平台,以及 Emoji ...
网页使用Font Awesome图标字体时，css定义 content 属性
网页使用Font Awesome图标字体时,css定义 content 属性必不可少,如下所示: .icon:before { content: '\f005'; font-famil ...
设计网页字体css,CSS样式设计网页字体与用户体验
CSS样式设计网页字体与用户体验互联网发布时间:2009-04-02 19:36:06 作者:佚名我要评论网页制作Webjx文章简介:在设计网页时,没有比页面的外观更重要的了.所以 ...
css 字体无法小于10号,css3让手机网页字体小于12px
手机端网页,可以说是寸土寸金,经常会遇到文字多一个就掉入第二行,这时要让字体小于12px就小不了了,特别是谷歌浏览器,就算是在css里写font-size:10px;那么还是显示12px的,那咋办?? ...
使用 Cufon 渲染网页字体
2019独角兽企业重金招聘Python工程师标准>>> 这是一篇关于 Cufon 技术的小文章.什么是 Cufon 呢?简单的说,Cufon 是一个用来替代 sIFR 框架,实现在网 ...
手机web——自适应网页设计（html/css控制） - 51CTO.COM
手机web--自适应网页设计(html/css控制) - 51CTO.COM 一. 允许网页宽度自动调整: "自适应网页设计"到底是怎么做到的? 其实并不难. 首先,在网页代码的头 ...
在chrome里查询修改html代码,我需要在网页中直接编辑CSS？打开Web代码检查器
我需要在网页中直接编辑CSS?打开Web代码检查器最受欢迎的支持问题是:"我必须编辑哪些CSS代码才能改变(-)的外观".几年前,CSS/HTML编辑器是最有用的web开发工具. ...

网页字体更清晰的css用什么？

网页字体更清晰的css用什么？相关推荐

最新文章

热门文章