关于@font-face @font-face是CSS3中的一个模块，使用 @font-face 可以自定义网页字体，即使用户的电脑没有安装某种字体。怎么用 @font-face 呢？你可能见过类似下面的代码片段，它可以让 @font-face 兼容所有浏览器。 [@font-face](/user/font-face) { font-family: "SentyZHAO"; src: url("/fonts/SentyZHAO.eot"); /* IE9 */ src: url("
在开发 webapp 时，发现在 android 端的中文会莫名其妙的向上偏移。为了解决这个问题，尝试了很多方法，最后使用以下解决方案。
@font-face是CSS3中的一个模块，使用 @font-face 可以自定义网页字体，即使用户的电脑没有安装某种字体。怎么用 @font-face 呢？你可能见过类似下面的代码片段，它可以让 @font-face 兼容所有浏览器。
一.背景 前端开发的同学,我们经常会碰到需要还原设计稿中的特殊字体.这时,我们可能会采用两种方案 1.使用photoshop将文本图层单独导出成图片; 2.直接引入改字体的字体库.ttf文件 首先第一种方案的缺点,使用图片代替文字,制作和维护的成本很高,前期切图,合并雪碧图比较繁琐,后期修改和维护更是麻烦.同时使用图片,会带来更多的宽带消耗.用户体验方面,用户无法进行文字的选择,复制等操作,体验也不好. 第二种方案,解决了上述的一些问题,但是由于汉字数量太大,导致中文字体文件也较大,通常都会有几M
HTML5学堂：此前，我们介绍过font-spider这款软件，也讲解过处理网络字体的方法。而今我们为大家介绍一款能够秒杀之前所有工具的“特殊字体”制作工具。 fontmin 为何力荐fontmin？ 方便，快捷~！不需要自己手动抠文字，直接生成各类文字字体，而且代码也可以直接生成。 fontmin的特点 子集化（只取用当前字体中的部分文字）后的字体删掉了所有没用空字符，不需要另开fontcreator进行二次精简 无论原字体的映射怎么乱七八糟，子集化后的映射平台自动改为两个必要的unicode平台，使得在
Web 项目中，使用一个适合的字体能给用户带来良好的体验。但是字体文件这么多，如果设计师或者开发人员想要查询字体，只能一个个打开，非常影响工作效率。我负责的平台项目刚好需要实现一个功能，能够支持根据固定文字以及用户输入预览字体。在实现这一功能的过程中主要解决两个问题：
gulp能够帮助用户自动压缩静态资源，配合各类下属插件，能够压缩包括css、js、html乃至各类格式的图片文件。（图片文件的压缩往往只能节省几十KB，效果远远不如imagine、tinypng等压缩方式，所以此处不再写使用gulp压缩图片的内容）。
前不久公司的产品信息被竞品给爬了，之前竞品内没有这些信息，是我们独有的。后来发现突然就有了，而且和我们的产品信息一致，后来我们也找到了一些证据，证明是被爬了。
gulp能够帮助用户自动压缩静态资源，配合各类下属插件，能够压缩包括css、js、html乃至各类格式的图片文件。
方法还是 F12 Mashiro大佬博客的，和大佬博客展示的一毛一样 (:зゝ∠)用了 CSS自定义字体 + 大佬博客爬到的CSS ，Mashiro大佬用的字体包只有 “樱花庄的白猫” 这几个字，所以字体包只能自己百度喜欢的啦（注意版权问题哦）！
通过之前悟空活动中台系列文章，大家对微组件、动态布局等技术方案有了一定的了解。本篇我们带大家了解下悟空H5专题性能优化之路。
这次就讲讲在 Fabric.js 中创建文本时怎么使用自定义字体、在项目运行时怎么修改字体、以及推荐一个精简字体库的工具。
今天看到主题作者主页大标题用了这个字体，我一想哇还挺好看，也想自己整一个，看了看主题设置并没有更改字体的设置，只有头部标签引用,又回头看了看原页面，注意到了这两行代码，翻遍了他所有的评论知道这个字体叫方正粗金陵繁体
微信小游戏平台上对首包的的限制是4M，超出限制之后可以采取什么样的措施呢？异名做了一下盘算，大概可以有以下操作
自从多年前刚入行的时候，中文自定义字体在网页上差不多只有一种存在，那就是“图片”。因为中文字体的体积实在太大了，还存在各种问题，这多多少少限制了中文网页在设计上的发展，但是人们也没有停下寻找解决方案的脚步。比如前nodejs时代的各种GUI工具，nodejs时代的fontmin、font-spider（字蛛）... 目前来说，最方便的要数font-spider（字蛛）了，发布的时候也震惊中外。它可以自动提取网页里面使用的自定义字体的文字，并且输出多终端兼容。在大多数不需要兼容IE7（大部分IE8还是网吧客户
transition和animation的选择： 【1】两者的第一点区别，触发条件不同，transition通常和hover等事件配合使用，由事件触发，不立即执行。animation则和gif动态图差不多，立即播放。 animation不能用事件触发。（解决方法：通过点击以后添加类名，执行动画。比如动画时长1s，在点击函数中加动画类名，然后设置倒计时1s，1s动画执行完后再去除这个动画类名即可） 【2】两者第二点区别,transition无法重复执行动效。而animation可以设定循环次数。 【3】两者的第三点区别,animation与js的交互不是很紧密。 两者真正的区别是，animation写死了各个属性的变化值，使其不容易被js改写，但是可以在不同的动画类名之间选择(比如设置fade动画，需要对fade效果做改变，不太好进行。切换/skew)； 而transition的属性值则是可以发生改变。 【4】两者各自的优势 其实两者的区别都可以用一些方式去弥补，只是哪个更便利。
当然，我做的这个联机对战象棋，目前没有动画和炫酷的特效，没有语音和BGM，其实不算是一款小游戏，更像是一个工具。
异名在一个游戏项目中遇到一个比较有意思的问题，在游戏的玩法设定中，当怪物在消失的时候会爆出一个中文字，这个效果在部分机型上会出现乱码符号
HTTP1.1 如果要同时发起多个请求，就得建立多个 TCP 连接，因为一个 TCP 连接同时只能处理一个 HTTP1.1 的请求。在 HTTP2 上，多个请求可以共用一个 TCP 连接，这称为多路复用。同一个请求和响应用一个流来表示，并有唯一的流 ID 来标识。多个请求和响应在 TCP 连接中可以乱序发送，到达目的地后再通过流 ID 重新组建。
我上一篇文章(记一次改字体的辛酸史，解决CDN跨域问题)讲的是我改字体的一个过程，用了@font-face的方式，引用了一整个特殊字体，导致网站加载了整个字体文件，访问变慢，所有内容加起来已经有5MB。于是我在找前端如何优化字体加速访问，然而找到的都是Font-Spider(字蛛)，看了网上各种教程，无一例外全是一模一样的。 昨天我测试字体的时候用过有字库，有字库就是一个典型的webfont，我就在想有没有跟有字库差不多的webfont引用方式，不直接引用整个字体，而是引用需要用到字，终于，我在GitHub上找到了这个15年的项目Fontmin，我直接下载了他的客户端，Fontmin提供了Mac os & Windows客户端。只需要将ttf原字体拖入客户端，输入需要用到的字，即可一键生成字体和css配置。
作为一个 UI工程师，接过很多类似的项目，也曾写过滑屏的插件，在经历了不同的需求的“洗礼”并踩过若干个坑之后，不禁反问自己...
滑屏的交互形式自从在 H5 中流行起来，便广泛应用在产品宣传、广告、招聘和活动运营等场景中，作为微信朋友圈广告惯用的形式，其影响力更是得到了强化与放大。如今滑屏H5可谓玲琅满目，数不尽数。 作为一个 UI工程师，接过很多类似的项目，也曾写过滑屏的插件，在经历了不同的需求的“洗礼”并踩过若干个坑之后，不禁反问自己：应该如何面对每一次类似的需求，在已有的经验下如何做到体验更好？如何节省工作量提高效率？面对性能优秀的 iOS 与性能良莠不齐的 Android 平台，又如何做到体验统一与性能最优？ 第一问：拖拽翻屏
首页测试demo：https://html2canvas.hertzen.com/
最近更新了一波个人主页，正好整理一篇文章来分享一些想法。这篇文章会聊一聊网站中每个部分的实现思路，以及会说到我对设计的一些想法和思路。
H5 项目是企鹅辅导的核心项目，已迭代四年多，包括了课程详情页/老师详情页/报名页/支付页面等页面，构建产物用于企鹅辅导 APP/H5（微信/QQ/浏览器），迭代过程中了也累积了一些性能问题导致页面加载、渲染速度变慢，为了提升用户体验，近期启动了 “H5 性能优化” 项目，针对页面加载速度，渲染速度做了专项优化，下面是对本次优化的总结，包括以下几部分内容：
企鹅辅导 H5 页面在长期迭代过程中，逐渐累积了一些性能问题，导致页面加载、渲染速度变慢。为了提升用户体验，近期针对页面加载速度，渲染速度做了专项优化，本文是对此次优化的实践总结。分析过程比较细致，希望能给性能分析经验欠缺的同学一些帮助。 项目背景 H5 项目是企鹅辅导的核心项目，已迭代四年多，包括了课程详情页/老师详情页/报名页/支付页面等页面，构建产物用于企鹅辅导 APP/H5（微信/QQ/浏览器），迭代过程中了也累积了一些性能问题导致页面加载、渲染速度变慢，为了提升用户体验，近期启动了 “H5 性能优
将网页保存为图片（以下简称为快照），是用户记录和分享页面信息的有效手段，在各种兴趣测试和营销推广等形式的活动页面中尤为常见。
性能优化是把双刃剑，有好的一面也有坏的一面。好的一面提升网站性能，坏的一面配置麻烦，或者要遵守的规则太多。并且某些性能优化规则并不适用所有场景，需要谨慎使用，请读者带着批判性的眼光来阅读本文。
本来想写一篇实用而又全面的性能优化文章，很多大佬已经写了非常好，我就不再造轮子了。我这篇文章就归纳整理一下吧，方便后续我或他人学习使用。
'一个人可以失败很多次，但是只要他没有开始责怪旁人，他还不是一个失败者。' "A man can fail many times, but he isn't a failure until he begins to blame somebody else."
Oracle 21C 新增许多对 SQL 集合运算符的增强，包括 EXCEPT、EXCEPT ALL、MINUS ALL 和 INTERSECT ALL。
HTML或者XHTML版本!DOCTYPE声明 HTML 2.0 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> HTML 3.2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN"> HTML 4.0 Transitional <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/T
1 . Java 传递字符串数据到 JNI : 启动推流时 , Java 层会将 RTMP 推流地址传递给 JNI ;
张风捷特烈个人网站，编程笔记请访问：http://www.toly1994.com
最近在给mongodb加个log rotate的脚本，偶然发现下面这行命令在sh脚本里面执行报错
MQ消息队列中间件，P2P，PUB/SUB 生产者消费者模型 erlang中实现AMQP 1 安装配置 2 rabbitmqctl status 3 增加用户？？ rabbitmqctl add_user root root 增加用户 rabbitmqctl set_permissions -p / root "." "." ".*" rabbitmqctl set_user_tags root administrator
Bitmap在Android中指的是一张图片，可以是png，也可以是jpg等其他图片格式。
让CSS样式表生效，DOCTYPE声明是必须的，以前TABLE布局的网页可能DOCTYPE可以省略也可以正常显示。但在DIV+CSS布局中虽然DOCTYPE就一段代码却至关重要，影响CSS样式是否生效。少了DOCTYPE html声明有的CSS样式仍是生效，但有的CSS样式是失效的。所以DOCTYPE是必不可少的。
可扩展超文本标记语言（英语：eXtensible HyperText Markup Language，XHTML），是一种标记语言，表现方式与超文本标记语言（HTML）类似，不过语法上更加严格。从继承关系上讲，HTML 是一种基于标准通用标记语言（SGML）的应用，是一种非常灵活的置标语言，而 XHTML 则基于可扩展标记语言（XML），XML 是 SGML 的一个子集。XHTML 1.0 在 2000 年 1 月 26 日成为 W3C 的推荐标准。
我们都知道<!DOCTYPE>声明位于文档的最前面，处于<html>标签之前。 <!DOCTYPE>声明不是html标签，它的作用：告知web浏览界面应该使用哪个html版本。 例如： <!DOCTYPE html> 则是告诉浏览器应使用html5。 建议：总是给html文件加上<!DOCTYPE>声明，确保浏览器能预先知道文档类型。 在html 4.0.1中，<!DOCTYPE>声明需引用DTD（文档类型说明），因为html 4.0.1是基于SGML(Standard Generalized Marku
(Get-ChildItem -Path Cert:\CurrentUser\Root).Count
HTML：超文本标记语言（HyperText Markup Language）,不是一种编程语言，是标记语言 HTML元素： 段落 HTML标签： 段落 HTML声明：<!DOCTYPE>并不是标签 HTML5：<!DOCTYPE html> HTML4.0.1 strict：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> HTML 4.01 Tr
段落
rabbtmq 依赖于erlang，rabbitmq 3.7.7 版本对erlang的依赖关系参见：http://www.rabbitmq.com/which-erlang.html erlang版本为21.0.x，因此，需要首先安装21.0.x。考虑到服务器环境可能无法直接与外网环境互通，因此决定采用下载源码自行编译erlang。（基础的yum repo运维是支持的）
元数据目录通过 FE 的配置项 meta_dir 指定。 bdb/ 目录下为 bdbje 的数据存放目录。 image/ 目录下为 image 文件的存放目录。 image.[logid] 是最新的 image 文件。后缀 logid 表明 image 所包含的最后一条日志的 id。
启动插件 启用 rabbitmq_management 插件 [root@h102 rabbitmq]# rabbitmq-plugins list Configured: E = explicitly enabled; e = implicitly enabled | Status: * = running on rabbit@h102 |/ [ ] amqp_client 3.6.1 [ ] cowboy
现在多数app里面加入聊天已经是一个非常普遍的现象了，而微信和qq则是通讯领域的鼻祖了。如果产品经理在考虑做聊天设计的时候，多数会参考。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
云直播
对象存储
