CSS Fonts Module Level 4 工作草案中的一大新特性即为 Color Font 的支持，来了解一下吧!如果你们设计师想在某些特别的专题活动中使用下图的字体作为标题字体进行展现，怎么办呢？做成图片咯。然后你可能会遇到这几个问题：不同屏幕下的适配，要是只做一种尺寸的图，放大或缩小后的效果都不太好。直接做成 SVG？好像不能复制到 Word 里面加粗啊，也就是说，这种做法使得这些“文字”本身失去了真实文字该有的能力。

在Web中很多场景中都会使用到Icon，那么就会面临Icon和文本对齐的处理。而这个对齐效果的处理又不是一件轻易的事情，特别是面又众多不同移动终端的情形之下。那么今天这篇文章就来和大家一起探讨一下这方面的话题。

虽然CSS简单，但CSS是一门非常有意思的语言，CSS每年都有变化，而且都有不同的博主都在不同的时间段总结一些CSS的新特性。虽然这些新特性无法立刻得到众多浏览器的支持，但总是随着时间的发展，这些特性都会得到浏览器的支持。哪怕未得到支持，也有一些方法让浏览器支持，比如最为出外的cssnext，就可以让很多未来的CSS特性就立马使用，并且不用花太多时间来考虑浏览器的兼容性。今天这篇文章,@Daniel Crisp就当下的CSS的新特性做了一个简单的总结 —— 五个最新的CSS特性（事实上这些特性，对我而言并不是新特性），并且用示例告诉大家怎么使用这些特性。那么接下来，咱们看看这五个新特性是什么？以及怎么使用。如果您感兴趣，欢迎继续往下阅读。

让我们来看看如何将<canvas>的自由度与HTML元素结合起来，使Web页面在视觉上有更好的效果。具体地说，我们将创建一个基于**HTML-to-particle**的效果，但同样的技术也可以用于实现很多类型的效果。在开始之前，可以通过Repo获取源代码。

通过上一节的学习，对DOM事件有了一个简单的了解。但这只是学习DOM事件相关知识的起步点。在JavaScript中常见的事件模型有：DOM基本事件模型、DOM Level 2事件模型、IE事件模型、DOM Level 3事件模型 和 自定义事件模型。每种事件模型都有其自己独具的特性。只有了解了DOM事件模型之后，才可以为后续的DOM事件打下一个基础。今天来了解一下DOM事件的模型。

如果你和我一样一直在关注CSS Grid布局的话，你应该知道@Rachel Andrew和@Jen Simmons都是CSS Grid 布局的布道师。两位女士一直都在推进Grid的特性和完善相关的特性。这几天看到@Jen Simmons录了一个视频，聊了一下CSS Grid布局相关的误区。

@js_tut的新书《CSS Visual Dictionary》里面的插画非常有意思。他在Medium上把盒模型、Flexbox、Grid三个部分放了一些出来。我觉得他提供的插画非常形象的阐述了这几个部分的知识点。今天把 Flexbox部分的插图直接拿来使用了，通过这些插图再次向大家阐述CSS Flexbox相关的知识。

CSS Paint API是一个令人非常兴奋的东西，也是令人激动人心的时刻，它将开启CSS新的旅程。接下来让我们一起来看看它是什么，为什么会有它以及如何开始使用它。

如果你浏览过早期的Web网站，或许你已经发现了这些Web站点除了能提供查阅信息之外，无其他作用可言。这样的Web站点其实是非常无聊的。那是因为Web站点没有提供人与机器的互动行为。激不起用户的兴趣。造成这种现象的原因很简单。Web应用程序或者Web站点存应该是为了响应用户对它们所做的事情。好比，我们每天一大早起床时就想好了一天要做些什么，这样每天都有动力，也变得充实。那么在Web应用或Web网站上其实也是类似的，Web网站之后做的事情很大程度上取决于你告诉他们做什么。这样一来，Web网站会变得有趣的多。