<div>
    初学者会认为canvas中的save方法是用来保存绘图状态的图形，而restore方法是用来还原之前
    保存的绘图状态的，其实不然。
    <p>save(): 保存当前的绘图状态</p>
    <p>restore(): 恢复之前保存的绘图状态</p>
    <p>在canvas环境中，可以利用所谓的绘图堆栈状态。每个状态随时存储canvas上下文数据。</p>
    <ul>
        <li>当前的坐标变换（变换矩阵）信息，比如旋转或平移时使用的rotate()和setTransform()方法</li>
        <li>当前裁剪区域clip()</li>
        <li>当前的虚线列表</li>
        <li>图形上下文对象(CanvasRenderingContext2D)的当前属性值，包括：
            <ul>
                <li>fillStyle: 填充路径的当前的颜色、模式或渐变</li>
                <li>globalAlpha: 设置图形和图片透明度的属性</li>
                <li>globalCompositeOperation: 指定颜色如何与画布上已有颜色组合（合成）</li>
                <li>strokeStyle: 描述画笔（绘制图形）颜色或者样式的属性</li>
                <li>lineWidth: 设置线段的宽度</li>
                <li>lineCap: 如何绘制每一条线段末端的属性 ["butt" | "round" | "square"]</li>
                <li>lineJoin: 指定线段连接的绘制方式 ["bevel" | "round" | "miter"]</li>
                <li>miterLimit: 当lineJoin为miter时，这个属性指定斜连接长度和二分之一线宽的最大比率</li>
                <li>lineDashOffset: 设置虚线偏移量的属性，例如可以实现“蚂蚁线“的效果</li>
                <li>shadowOffsetX: 描述阴影水平偏移距离的属性</li>
                <li>shadowOffsetY: 描述阴影垂直偏移距离的属性</li>
                <li>shadowBlur: 描述模糊效果程度的属性；它既不对应像素值也不受当前转换矩阵的影响</li>
                <li>shadowColor: 阴影颜色</li>
                <li>font: 描述绘制文字时，当前字体样式的属性。使用和 CSS font 规范相同的字符串值</li>
                <li>textAlign: 描述绘制文本时，文本的对齐方式的属性 ["left" || "right" || "center" || "start" || "end"]</li>
                <li>textBaseLine: 描述绘制文本时，当前文本基线的属性 ["top" || "hanging" || "middle" || "alphabetic" || "ideographic" || "bottom"]</li>
                <li>direction: 在绘制文本时，描述当前文本方向的属性 ["ltr" || "rtl" || "inherit"]</li>
                <li>imageSmoothingEnable: 用来设置图片是否平滑的属性，true 表示图片平滑</li>
            </ul>
        </li>
    </ul>
</div>