文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

woff字体图元结构剖析，自定义字体的制作与匹配和识别

WOFF – Web Open Font Format (.woff)： 专门为了Web而设计的字体格式标准，实际上是对TrueType/OpenType等字体格式的封装，每个字体文件中含有字体以及针对字体的元数据...在上次从css的@font-face提取出字体URL链接时，就包含了eot和woff两种格式。鉴于woff字体更容易被分析，所以我们上次选择了只下载woff字体格式，今天这篇文章也一样。...TrueType字体中常见的表有： 字体头表（head表） 字体头表（head表）中包含了TrueType字体的全局信息，在c语言中的结构定义如下： typedef sturct { Fixed...字体 有了前面的基础，现在对于乱序了轮廓图顺序的woff字体，已经变得非常简单。...在上一篇文章中，我们通过二级缓存解决了cssURL和fontURL随机以及Unicode代码点顺序点随机的问题，本文进一步考虑针对自定义字体文件内部，轮廓图甚至基础字形也随机怎么处理。

9.2K20
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    修改TTF文件或者otf文件或者woff文件内的字体名称

    使用软件为FontCreator，我这里用的版本为12，官网为http://www.high-logic.com/ ，是收费软件，但是有pojie版。...2.菜单项选择Font=》Properties，打开Font Properties弹窗。...3.在弹窗里面看到有几个子标签页，其中Identification标签页里面的 Font Family即为字体的英文名，自行修改成自己需要的值。...第二列是Name ID，简体中文系统上，找到行 Chinese-People's Republic of China Font Family， 在这一行可以看到Content就是简体中文系统上字体的中文名...但实际上抗锯齿应该跟字体源有关系吧，我测试时使用 的ttf文件里面的字体可能是没有抗锯齿的，保存的时候选了Auto Hinting也没什么用，但让

    6.8K20

    Nginx无法加载.woff .eot .svg .ttf等字体文件的解决办法

    很久之前写过windows20008服务器无法加载woff文件的问题，文章是：解决网站部署svg/woff/woff2字体404错误的方法，今天来说下Nginx无法加载woff的问题，我目前使用的是程序是... /dev/null;         access_log /dev/null;     } 注意，配置文件是存在的，仅仅需要添加其中的“|eot|otf|ttf|woff|woff2|svg”后缀即可...，就是这些字体文件，添加进去即可，害怕设置错误的话还可以新建一个配置段落，代码如下： #加载woff字体     location ~ \....(eot|otf|ttf|woff|woff2|svg)$ {         add_header  Access-Control-Allow-Origin *;     } 这个是独立独立的段落，功能增加的是跨域代码...问题解决了，很简单，几个代码，但是我还是有个疑问，为什么我的主站代码一切正常，这个测试站TP5却得手动添加呢？

    6.8K20

    七招打造有逼格的字体

    所以今天和大家分享的更像是一个字体设计的“过程”，七种招式我们“刚柔并济”分为灵感篇与方法篇，从字体设计最初的思考入手，看看字体设计的灵感都是从何而来，又是如何一步步实现有逼格的字体。...希望本期的分享能让你面对字体，春暖花开~ 对了，之前《零基础的字学之路》那篇帖子有介绍过一些方法，这次算是加料升级。好，让我们开始吧! 灵感这东西其实是看得见摸得着的，因为它就存在于我们身边的点滴。...很多时候我们会被一首歌打动，会为一本书里某一句话而感动，又或者是让某一件事某一个人左右了自己的心情...总之，生活处处有惊喜，当然也会有各式各样的小状况，其实这些都可以作为你字体设计中点燃灵感的小火花。...方法有很多，我列举了最为基础实用的几种方法与大家分享，其实每种方法对应的是无数种字体设计的可能，很多惊喜等你发现。 ? 块面组合法是字体设计中最为基础也是最常规的设计方法。...需要特别注意的是，当整个字笔画都是以均匀的线段为主时，线段之间的穿插分布切忌过密过疏，尽量保持匀称，适当增加字体内部空间，透气性佳整体才会更显轻盈雅致。 ?

    79520

    minigui 3.2.0:基于miniStudio应用TrueType字体的过程(2)-字体边缘锯齿,字库剪裁

    (1)》,下半部分用MarkdownPad2编辑，使用MarkdownPad2内置的图床，可能显示图片会有些慢。...TrueType字体的边缘锯齿 上节我们已经成功在miniStudio中加载了TrueType字体，但是如果你仔细看，发现这个字体效果有问题，有明显边缘锯齿和和残点，太丑陋啦，不可忍呐！...2.png 这里是说明如何在编程时通过设置逻辑字体风格(style)来指定字体的渲染特效消除锯齿的，对应到miniStudio图像界面中就是在选择字体的(style) 3.png OK,边缘锯齿问题解决...剪裁字库.汉字字库有几千个汉字，我们的系统中可能只用到其中很少一部分，所以要想办法从TTF字库中提取项目中到的汉字的字体，生成一个更小的字库文件。....有java和c++两套代码，java代码中提供的sfnttool jar包就是我们需要的工具。

    1.7K50

    第104天：web字体图标使用方法

    字体图标经常使用的是 阿里图标库的：http://www.iconfont.cn/ icomoon图标库的：https://icomoon.io/ 一、阿里库字体图标使用 第一步： 首先进入阿里巴巴矢量图网站...只能使用平台里单色的图标，就算项目里有多色图标也会自动去色 　　注意：新版iconfont支持多色图标，这些多色图标在Unicode模式下将不能使用，如果有需求建议使用Symbol的引用方式 　　使用步骤如下...2、FontClass方式 FontClass是Unicode使用方式的一种变种，主要是解决Unicode书写不直观，语意不明确的问题。...这种用法其实是做了一个svg的集合，与另外两种相比具有如下特点： 支持多色图标了，不再受单色限制 通过一些技巧，支持像字体那样，通过font-size,color来调整样式（对于前两种也是同样适用的，fontsize...m3vgb7#iefix') format('embedded-opentype') 改为内部链接： @font-face {   font-family: 'icomoon';   src:  url

    1.9K10

    2019年末逆向复习系列之从猫眼字体反爬分析谈谈字体反爬的前世今生

    ，那么每次网站引用这个woff文件之后，都可以用相同的编码来替换想要替换的数据，这就是最初的时候的字体反爬。...阶段二：字体信息不换，动态更换字符编码 反爬方：既然写死的woff文件太容易让人解析，那就每次都更换新的woff文件，woff文件不更换字体信息，只更换字符编码，这样，每次的字符编码都不一样，解析的时候就不能使用同一套字符编码字典去解析了...阶段三：有了动态的编码，再搞个动态字体坐标？ 反爬方：动态更换字符编码集也能根据字体坐标来破解，要是新旧两个字符的坐标不是按照一定的偏移量来做的呢？...目前还没有新的字体反爬的手段出现，更多的@font-face的加密上面，比如对字体文件的地址做基本的Js加密等等什么的，其他的我就暂时没发现，有发现的大佬可以透露一下。...由于采集的字体数据不多，如果按随机分割的方式，训练集容易缺失某些字符，导致预测测试集的结果误差率较大，所以在此固定前40个样本为训练集，最后10个样本为测试集合。

    1.1K21

    django2用模板代码图标字体丢失报404 cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff

    但，django毕竟还没大行其道，在网上的模板中，基本上所有的模板，都是在为phper开发方便而做的，虽然大同小异，django拿过来用也没什么，但是多多少少也会一些大坑小坑，其中字体的路径配置，就需要讲究一下...HTTP/1.1" 404 #…… 将前端模板代码导入django项目中，运行一看，前端的图标字体丢失了，全都变成了小方块 问题出在哪？...出在一个css文件中，这个文件就是font-awesome.min.css 解决方案： 1.打开font-awesome.min.css 2.删除此文件的第一行（别管有多长） 3.在html文件中，加入...webkit-font-smoothing:antialiased;-moz-osx-font-smoothing: grayscale; *margin-right:.3em;} 4.这时，再运行项目，发现图标字体都出现了...其实这个时候已经不影响使用了，但是仍然还可以看到类似于下面这样的报错，令人看着非常不爽 [23/May/2018 23:06:21] "GET /static/font/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff

    1.1K30

    2019年末逆向复习系列之从猫眼字体反爬分析谈谈字体反爬的前世今生

    ，那么每次网站引用这个woff文件之后，都可以用相同的编码来替换想要替换的数据，这就是最初的时候的字体反爬。...阶段二：字体信息不换，动态更换字符编码 反爬方：既然写死的woff文件太容易让人解析，那就每次都更换新的woff文件，woff文件不更换字体信息，只更换字符编码，这样，每次的字符编码都不一样，解析的时候就不能使用同一套字符编码字典去解析了...阶段三：有了动态的编码，再搞个动态字体坐标？ 反爬方：动态更换字符编码集也能根据字体坐标来破解，要是新旧两个字符的坐标不是按照一定的偏移量来做的呢？...目前还没有新的字体反爬的手段出现，更多的@font-face的加密上面，比如对字体文件的地址做基本的Js加密等等什么的，其他的我就暂时没发现，有发现的大佬可以透露一下。...由于采集的字体数据不多，如果按随机分割的方式，训练集容易缺失某些字符，导致预测测试集的结果误差率较大，所以在此固定前40个样本为训练集，最后10个样本为测试集合。

    1.3K30

    CSS3与页面布局学习总结（五）——Web Font与Sprite

    通过管理字体文件你可以很自然的组织你的icon集合，任意的进行修改或扩展 可推广性（Adoption）： 然而，应用这样的icon fonts可能会影响你和你同事之间的工作流程，但说服让他们采用这样的技术也非常简单...1.3、字体格式 1.3.1、TureType(.ttf)格式： .ttf字体是Windows和Mac的最常见的字体，是一种RAW格式，因此他不为网站优化,支持这种字体的浏览器有【IE9+,Firefox3.5...字体是IE专用字体，可以从TrueType创建此格式字体,支持这种字体的浏览器有【IE4+】； 1.3.5、SVG(.svg)格式： .svg字体是基于SVG字体渲染的一种格式,支持这种字体的浏览器有【.../font/fontello.woff2?53711433') format('woff2'), url('../font/fontello.woff?.../CSS3_5 提示：使用字体文件时请尊重创作者的版权，商业应用应该更加慎重，不过还是有不少的开源字体库的。

    2.8K60

    一起来相约猫眼

    一起来相约猫眼 0.说在前面1.原理2.相约猫眼3.作者的话 0.说在前面 之前有人给我提了个需求，让我去看看猫眼专业版，字体反爬问题，我觉得有趣，因为之前没学过字体反爬。...我们将这里的d09开头到AAA结尾这一整块的字体编码复制出来，并通过python代码进行base64解码，并保存为maoyan.woff格式的字体。...这里介绍一个查看woff字体内部对应编码的网站： http://fontstore.baidu.com/static/editor/index.html 下图是我随机将woff文件打开后的样子！...这里再做解释，第一次我们取网站上的一个字体并解码为xx.woff，并得到映射关系，相应的编码相应的字体对象，而编码又与字体对应，反过来，当我们随机取得网上另外一个yy.woff字体时，我们知道了该字体的对象...将字体存储为xml文件以及woff文件，这里填入自己在网站的上那一串字符！

    75920

    (转载非原创)前端网页字体优化指南

    ，甚至有时候一个字体比其他所有的资源（js、css、图片）加起来还要大，对网页的加载性能起到非常关键的影响，因此有必要对字体进行一些优化。...TTF 字体转 WOFF2 TTF 字体，是苹果和 windows 都支持的一种字体，因此是美术同学最喜欢用的。...TTF 转换 WOFF2 是比较简单的，可以选择线上转换，推荐的网站有以下两个 ttf-to-woff2 webfont-generator 但是个人觉得线上转换等待上传的时间比较久，而且有时候生成的文件是空白的...（PS：WOFF2 字体没有必要再开启 GZIP，因为这个字体文本本身就是压缩过的）。...小结 关于字体优化技巧就先写到这里啦，有问题的欢迎留言交流哈。

    1.9K00

    动态加密？看我如何见招拆招爬取某点评全站内容！

    在前几天的文章中，我针某点评商家搜索页面的字体反爬给出了解决方案，但是还有一个问题，那就是当时给出的方法是下载对应的woff字体文件，然后建立加密字体与编码之间的映射关系来进行破解。...但是有一个问题就是不同页面的字体文件，是动态加载的，换句话说就是你在这个页面建立的映射关系，换一个页面就不能用了。 那就没有解决办法了吗？...其实也不难，或者说对方还是给了很清晰的思考方向，因为，虽然每一个页面的字体是动态加载的，但是这个动态仅针对字体解析后编码的变化，字体内部顺序是没有变化的，也就是如下图所示 ?...第二行代码使用requests请求css内容 最后两行代码使用正则提取woff字体文件所在URL ” 如果你传进去的页面是正常的，那么现在我们就有地址、均价字段的字体所在URL，下面就可以使用requests...font_price = TTFont('price.woff') font2 = font_price.getGlyphOrder()[2:] font2 = [font2

    81420

    爬虫遇到字体反爬，哭了

    2、查看字体库 这里使用FontCreator的工具查看字体库。...3、为什么会有三个字体库 [5ddc3af1c8d8d6daec9e9c89f10e2158.png] 在查看加密字体的CSS样式时，方式有css内容是这样的 [303bfce7dcd4347b5fecba54ca2f1e88....png] 字体库1：d35c3812.woff 对应解码class为 shopNum 字体库2：084c9fff.woff 对应解码class为 reviewTag和address 字体库3：73f5e6f3....png] 咱们这里获取的评论数，clas为shopNum，需要用到字体库d35c3812.woff 03 代码实现解密 1、加载字体库 既然我们已经知道了字体反爬的原理，那么我们就可以开始编程实现解密还原...因此我们可以建立应该字体对应集合 [28f19530b2ffa4da9c4e3f27f32142f1.png] 建立好映射关系好，到网页源码中去进行替换 [887046932853d00a17d9e08e1c57c4e9

    1.7K20

    TTF、TOF、WOFF 和 WOFF2 的相关概念

    但其实那不是最优解决方案，因为字体文件不止有 TTF 格式，常见的字体格式还有 OTF、WOFF 和 WOFF2 等。...2 字体，它的字体格式采用 Unicode 编码，是一种兼容各种语言的字体格式。...其兼容性如下： [image-20220130224605119] WOFF2 WOFF 2 标准在 WOFF1 的基础上，进一步优化了体积压缩，带宽需求更少，同时可以在移动设备上快速解压。...总结 通过上面的概念，可以看出： TTF 的兼容性更好，但是其字体文件体积最大。 WOFF 字体比 TTF 字体有更小的体积和更好的表现性。 WOFF 2 字体是对 WOFF 字体的升级。...所以，如果不考虑兼容性的话，字体使用首推 WOFF 2 ，这也是我在文章开头说使用 TTF 并非最优解决方案的原因，大家可以根据自己的实际情况，酌情选择合适的字体文件，以达到性能优化的目的。

    2.7K30

    Web 中文字体性能优化实践

    #iefix') format("embedded-opentype"), url("webfont.woff2") format("woff2"), url("webfont.woff...，无论其字形轮廓是 TrueType 格式还是基于 PostScript 语言的 CFF 格式，其必须包含的表有 cmap、head、hhea、htmx、maxp、name、OS/2、post。...fontmin 截取字形原理 fontmin 内部使用了 fonteditor-core，核心的字体处理交给这个依赖完成，fonteditor-core 的主要流程如下： ? 1....fontmin 是支持生成 woff2 文件的，但是官方文档并没有更新，最开始我使用的 woff 文件，但是 woff2 格式文件体积更小并且浏览器支持不错 字体名称 大小 时间 HanyiSentyWoodcut.ttf...48.2MB 17.41s HanyiSentyWoodcut.woff 21.7KB 0.19s HanyiSentyWoodcut.woff2 12.2KB 0.12s 字体加载完成前不展示预览内容

    3.1K10
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

      领券