CSS   发布时间:2022-04-17  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了css – 如何真正看到元素使用的字体?大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
当我看到一个 HTML元素的字体系列(从js,firebug或类似的)它总是一个列表.如何从列表中查看实际使用的字体?

解决方法

Firefox的 Font Finder附件可以做到这一点.由于它显然是可行的,如果这是内置于Firebug的话,那肯定会很方便.

2012/2/4更新:

我检查了字体查找器源,以了解它的工作原理,这实际上是一个聪明的小黑客.相关代码位于fontfinder.js中的Detector class中.引用来源:

它的作用就像Marcel’s answer的自动化版本.
那么它的作用是将一个虚拟元素(文本“mmmmmmmmmmlil”)添加到DOM中.它设置为使用浏览器后备字体“serif”,字体大小为72px.在这种情况下,Font Finder知道使用后备字体时元素的宽度和高度.接下来,它只是遍历font-family中列出的所有字体,依次为列表中的每个字体设置元素上的字体.如果元素的宽度和高度与设置后备字体的宽度和高度相匹配,我们可以推断给定的字体不存在.列表中第一个在该元素上生成不同宽度或高度的字体将是实际呈现的字体(注意:当后退字体“serif”在font-family列表中时,会出现特殊情况).

还有一个Chrome版本的字体查找器.它的不同之处在于(relevant source)浏览器后备字体似乎是“sans”,而不是“serif”.​​使用这种方法的任何代码都必须具有浏览器特定的后备字体知识.

大佬总结

以上是大佬教程为你收集整理的css – 如何真正看到元素使用的字体?全部内容,希望文章能够帮你解决css – 如何真正看到元素使用的字体?所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: