摘要： 网页使用的字体需要受制于操作系统，如果用户的操作系统没有安装某个字体，网页则会退而求其次的使用系统自带的字体。 因此我们并不能随便使用一些好看的字体，只能选用一些安全字体。比如：Helvetica，Arial，宋体，微软雅黑，如果能在网页上使用好看的字体就好了~ 可是引入字体对于英文来说，是合适的， 阅读全文

摘要： web api 阅读全文

摘要： 受到同事启发，突然发现了几个有趣又实用的web api，没想到前端还有这么多有趣的东西可以玩~~简直过分。 1.电池状态API navigator.getBattery()：这个api返回的是一个promise对象，会给出一个BatteryManager对象，对象中包含了：设备是否在充电，电量，以及 阅读全文

摘要： canvas的图像变换api，可以帮助我们更加方便的绘画出一些酷炫的效果，也可以用来制作动画。接下来将总结一下canvas的变换方法，文末有一个例子来更加深刻的了解和利用这几个api。 1.画布旋转api 这里要先了解另一个api translate(x,y):重新定义画布上（0，0）的位置。 首先 阅读全文

摘要： canvas可以绘制出很多奇妙的样式和美丽的效果，通过几个简单的api就可以在画布上呈现出千变万化的效果，还可以制作网页游戏，接下来就总结一下和绘图有关的API。 绘画的时候canvas相当于画布，而context相当于画笔。 1.绘制线条 moveTo(x0,y0)：把当前画笔（ictx）移动到（ 阅读全文

摘要： 这段时间一直在研究canvas，突发奇想想做一个可以截屏视频的功能，然后把图片拉去做表情包，哈哈哈哈哈哈~~ 制作方法： 1.在页面中加载视频 在使用canvas制作这个截图功能时，首先必须保证页面上已经加载完成了这个视频，这样才能够方便的对其操作。如果使用下面直接嵌入<video>标签的方式： 在 阅读全文

摘要： 制作动态的网页是是前端工程师必备的技能，很好的实现动画能够极大的提高用户体验，增强交互效果，那么动画有多少实现方式，一直对此有选择恐惧症的我就总结一下，以便在开发的时候选择最好的实现方式。 1.css的transition。 语法： transition抓住了所设置变化属性的起始态和完成态，通过设定 阅读全文

摘要： 先上一个兼容性总结图：老版本ie可以直接用复杂方法了，套用某表情包的话： 2016年了，做前端你还考虑兼容IE6？你这简直是自暴自弃！ 好了，知道了兼容性，我们可以放心的使用了。 在CSS3中扩展了颜色值包含 currentColor 关键字，相当于元素color属性的计算值，让没有默认继承的子元素 阅读全文

摘要： 工作中常会有需求向用户发送邮件，需要前端工程师来制作html格式的邮件，但是由于邮件客户端对样式的支持有限，要兼容很多种浏览器需要注意很多原则： 1.邮件使用table+css布局 2.邮件主要部分在body内部，所以样式一定要写成内嵌的，不能在head标签中写style，也不能外联。 如： 3.不 阅读全文

摘要： 在开发过程中，很多需求需要我们居中一个div，比如html文档流当中的一块div，比如弹出层内容部分这种脱离了文档流等。不同的情况有不同的居中方式，接下来就分享下一下几种常用的居中方式。 1.text-align:center方式 代码： 这种方式可以水平居中块级元素中的行内元素，如inline，i 阅读全文