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

html-css012

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

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