文章关键字 ‘font-face’

超酷!CSS font-palette与彩色字体显示

2022年07月21日,星期四

封面图

本文详细介绍关于多彩字体的知识,以及如何使用 font-palette 等CSS属性设置字体的不同色调,国内首发,稀缺干货知识。

阅读全文…

详解日后定会大规模使用的CSS @layer 规则

2022年05月28日,星期六

封面图-披萨可乐

我话就放在这里了,不出三年,CSS @layer 规则一定会在业界遍地开花,到处使用。

阅读全文…

JS FontFace API字体加载失败或完毕的检测

2022年04月27日,星期三

font 字体封面图占位图

如何判断 CSS @font-face 规则中的字体是否加载结束,是否加载成功?本文提供的方法你一定喜欢。

阅读全文…

使用CSS size-adjust和unicode-range改变任意文字尺寸

2022年03月27日,星期日

无标签字号设置

介绍一个无需HTML标签就能控制任意字符字号大小的CSS技术,关键时候说不定可以救命,都来学学吧。

阅读全文…

ascent-override descent-override line-gap-override一锅端

2022年03月21日,星期一

破茧成蝶

@font-face 自定义字体的又新增了一些新属性,进来看看都是干嘛用的吧,说不定可以解决你的超级棘手的难题!

阅读全文…

关于CSS emoji字体和OpenType-SVG我所知道的一些事

2020年03月12日,星期四

Emoji文章缩略图

关于Emoji字体你可能不知道的一些知识,顺便简单介绍了下彩色字体标准之一的OpenType SVG字体的一些知识。

阅读全文…

了解woff2字体及转换

2018年07月25日,星期三

文章头图

woff字体在2012年12月被World Wide Web Consortium (W3C)推荐使用,IE9+浏览器支持。woff2字体最早在在2013年7月Chrome Canary版本上可以使用,发展到现在,几乎已经成为自定义图标字体使用的标配。

本文就将介绍关于WOFF2诸多基础知识,包括优点特性,如果TTF字体转WOFF2字体,如何在CSS中使用,mime type设置等,有截图有必要的源代码展示。希望本文内容能够对您的学习有所帮助。

阅读全文…

真正了解CSS3背景下的@font face规则

2017年03月30日,星期四

很多人只要一提到@font face规则,心中就会不由自主“哦~~”的一声:“这个我知道,可以用来生成自定义字符小图标!”话是没错,问题在于很多人就以为生成字符小图标就是@font face规则的全部,实际上只是功能之一,如果真正了解@font face规则,你会发现,@font face规则可以做的事情其实非常多,尤其我们不考虑IE7,IE8浏览器的情况下……

阅读全文…

CSS unicode-range特定字符使用font-face自定义字体

2016年11月12日,星期六

一看名称,很多小伙伴可能认为是个什么生僻的东西,实际上,这玩意只是名字怪怪的,功能关键时刻还是很管用的。

unicode-range是一个CSS属性,一般和@font-face规则一起使用。在自定义字体的时候,可以指定某些字符使用该字体,其他字符依然使用默认的或者其他的字体。这种特性在某些场景非常有用,也可以用来实现一些特殊的效果。

本文有详尽文字阐述,必要的源代码展示,精彩的实例页面和签到好处的效果截图以及多个字符处理相关的工具露脸,总之希望本文的内容能够对您的学习有所帮助。

阅读全文…

等宽字体在web布局中应用以及CSS3 ch单位嘿嘿

2016年07月9日,星期六

所谓等宽字体,一般是针对英文字体而言的。东亚字体,据我所知,应该都是等宽的,就是每个字符在同等size下占据的宽度是一样的。但是英文字体就不一定了,就难本文来说,我下面写一个单词,什么呢,就iMac吧,大家打开自己的像素眼,就会很明显地发现这个字符’i’要不其他字符,例如’M’占据的宽度要小.但是,如果是等宽字体,宽度就一样,那么这种表现在web布局中有没有什么作用呢?还有CSS3 ch单位和他又有什么千丝万缕的关系呢?

阅读全文…