以前看过许多教学视频，大部分讲师都是讲个大概，然后就开始无厘头的灌输知识了。直到我后来看到一位优秀讲师的视频，他的讲课模式是第一堂课展示成果。这样下来，当我看到最终效果，我就有心思去不断学习这个东西了。 1. 简单的渐变动画 2. 稍复杂的关键帧动画 3. 结合transfor…

1em与当前元素的字体大小相同（更具体地说，一个大写字母M的宽度）。CSS样式被应用之前，浏览器给网页设置的默认基础字体大小是16像素，这意味着对一个元素来说1em的计算值默认为16像素。但是要小心—em单位是会继承父元素的字体大小，所以如果在父元素上设置了不同的字体大小，em…

公司许多的业务都还停留在使用px和弹性布局来进行样式处理的阶段，有些时候是因为视觉要求，有些时候是害怕线上问题，所谓破而后立。 移动端适配方案是一个老生常谈的话题，但是对于不同的项目、不同的业务场景可能会需要不同的适配方案来进行移动端适配，向下兼容的baseline也需要提前订…

最近，我从 Grover网站上发现以一个好玩儿的悬停动画，也有了些自己的灵感。这个动画是将鼠标移动到订阅按钮上移动光标会显示相应的彩色渐变。这个想法很简单，但是它能使这个按钮脱颖而出，人们一下子就注意到它了，增加了点击的概率。 怎样才能达到这个效果，使我们的网站脱颖而出呢？其实…

做前端开发有一段时间了，在这段时间里面，对于自己的要求，不仅仅是项目能完成，功能正常使用这一层面上。还尽力的研究怎么写出优雅的代码，性能更好，维护性更强的代码，通俗一点就是重构。这篇文章算是我一个小记录，在此分享一下。该文章主要针对介绍，例子也简单，深入复杂的例子等以后有适合的…

何为技巧，意指表现在文学、工艺、体育等方面的巧妙技能。代码作为一门现代高级工艺，推动着人类科学技术的发展，同时犹如文字一样承托着人类文化的进步。 每写好一篇文章，都会使用大量的写作技巧。烘托、渲染、悬念、铺垫、照应、伏笔、联想、想象、抑扬结合、点面结合、动静结合、叙议结合、情景…

做移动端自适应时可能很多人都对自适应和dpr之间的关系产生疑问,也有一些人会疑虑比如我的自适应方案没有加dpr会不会出问题,针对这些疑问我说一下我的见解,希望能解除你的担忧。 1. 什么是尺寸自适应 首先说到自适应,可能在不同人眼里理解不同，特别与响应式的关系,在这里说一下我所…

与同为人类的程序员沟通，帮助程序员快速掌握当前代码。这一点其实是可以通过注释来实现的，不过用上语义化HTML多多少少可以省点注释，哈哈。 与同为代码构筑的系统（例如残疾人士阅读器以及搜索引擎爬虫等）沟通，帮助其快速、准确达到目的。由于这类系统与人类的智能相比起来实在有限，因此需…

浏览器使用流式布局模型 (Flow Based Layout)。 浏览器会把HTML解析成DOM，把CSS解析成CSSOM，DOM和CSSOM合并就产生了Render Tree。 有了RenderTree，我们就知道了所有节点的样式，然后计算他们在页面上的大小和位置，最后把节点…