00、前端图形

前端代码实现图形的几种方式：CSS、SVG、Canvas（主要是JavaScript编码）

CSS也是可以画图的，需要借助于高宽、边框border、clip-path裁剪、渐变色背景等属性来模拟实现各种图形，当然只能实现一些简单的图形。

border：用四条边框样式属性的各种组合变换，实现一些简单的图形。网上也有画一些稍微复杂的图形，如哆啦A梦，但代码量稍多，可读性不好，并不推荐。

  
border
  
圆角按钮
  
radio
  
三角形
  
三角形

01、< svg>矢量图形

< svg>可缩放矢量图形（Scalable Vector Graphics，SVG），是一种基于 XML（数学）描述的二维的矢量图形，内容可以直接插入网页，成为DOM的一部分，然后用 JavaScript 和 CSS 进行操作。SVG 内容也可以写在一个独立文件中，然后用CSS（background-url）、、