纯 CSS 实现格子纸背景

在 决定下一步行动」，真正让待办清单为你所用 看到几张漂亮的手写字体插图。讨论区也都在问这几张插图是如何做出来的。

格子纸-图片来自少数派

用 Markdown 生成漂亮的手写图 (Mac Only) 一文用纯 CSS 实现了这个效果。一直使用 Windows 平台，就尝试在用纯 CSS 写一个类似效果。放大原图可看到一些噪点，让纸张的感觉更加逼真。噪点使用 NoisePNG 实现的。NoisePGN 是把背景当图片来处理，这里只是用纯 CSS 实现，所以只能是说近似原图效果。

代码如下：

参考：css3pie