CSS 奇思妙想 | Single Div 绘图技巧

经常能看到有关 CSS 绘图的文章，譬如使用纯 HTML + CSS 绘制一幅哆啦 A 梦图画。实现的方式就是通过堆叠 div，一步一步实现图画中的一块一块。这种技巧本身没有什么问题，但是就是少了一些难度，只需要有耐心，很多图形还是能够被慢慢实现出来的。

基于 CSS 绘图的这个需求，逐渐又有了新的一个流派，单标签实现图形，也就是说，一个复杂的图形只借由一个标签完成，这个相对于能够无限使用标签，不断堆叠 div 来说，无疑难度上升了很多，也要求对 CSS 有着更深刻的理解。

譬如下面这个图形，就是由一个 div 元素完成，源自于 A Single Div：

本文就将介绍一些使用单标签绘图的技巧，并且使用这些技巧，借用单个标签去实现一些复杂图形~

标签：linear,gradient,444,Single,奇思妙想,rgba,div,Div,transparent
来源： https://www.cnblogs.com/coco1s/p/14836075.html