关于CSS3 @font-face 中local('☺')的意思

html-css05

这其实是一个规避异常情况写法,因为浏览器默认会首先检测用户的系统字体是否有和 @font-face 声明的字体同名的字体,如果有就是优先使用系统字体,由于 @font-face 通常是开发者自定义生成的字体,可能和系统字体有差异,所以可以使用 src: local('☺') 来规避,因为 OpenType 协议规定字体名字中含有双字节 unicode 字符会被视作非法,所以这个笑脸就是用来让浏览器不匹配到任何系统字体,从而规避 @font-face 字体可能和系统字体重名而造成的问题

ElementPlus官网右上角的开关是基于HTML和CSS来实现的。首先,利用HTML中的<input type="checkbox">这个标签来创建一个开关,然后通过CSS中不同的类来设置打开和关闭状态时开关背景图片的样式显示,最后使用JS代码来实现开关状态切换时对其他网页元素的操作。