--- title: CanvasGradient slug: Web/API/CanvasGradient translation_of: Web/API/CanvasGradient --- <div>{{APIRef("Canvas")}}</div> <p><code><strong>CanvasGradient</strong></code> 接口表示描述渐变的不透明对象。通过 {{domxref("CanvasRenderingContext2D.createLinearGradient()")}} 或 {{domxref("CanvasRenderingContext2D.createRadialGradient()")}} 的返回值得到.</p> <h2 id="属性">属性</h2> <p><em>不透明对象,没有暴露的属性.</em></p> <h2 id="方法">方法</h2> <p><em>没有继承的方法</em></p> <dl> <dt>{{domxref("CanvasGradient.addColorStop()")}}</dt> <dd>添加一个由<code>偏移(offset)</code>和颜色(<code>color</code>)定义的断点到渐变中。如果偏移值不在0到1之间,将抛出<code>INDEX_SIZE_ERR错误,如果颜色值不能被解析为有效的</code>CSS颜色值 {{cssxref("<color>")}}<code>,将抛出SYNTAX_ERR</code>错误。</dd> </dl> <h2 id="Specifications" name="Specifications">标准</h2> <table class="standard-table"> <thead> <tr> <th scope="col">标准</th> <th scope="col">状态</th> <th scope="col">备注</th> </tr> </thead> <tbody> <tr> <td>{{SpecName('HTML WHATWG', "the-canvas-element.html#canvasgradient", "CanvasGradient")}}</td> <td>{{Spec2('HTML WHATWG')}}</td> <td>同 {{Spec2('HTML Canvas 2D Context W3C')}}</td> </tr> <tr> <td>{{SpecName('HTML Canvas 2D Context W3C', '#canvasgradient', 'CanvasGradient')}}</td> <td>{{Spec2('HTML Canvas 2D Context W3C')}}</td> <td>初始定义</td> </tr> </tbody> </table> <h2 id="浏览器兼容性">浏览器兼容性</h2> {{Compat("api.CanvasGradient")}} <h2 id="请参考">请参考</h2> <ul> <li>创建方法在{{domxref("CanvasRenderingContext2D")}}.</li> <li>{{HTMLElement("canvas")}} 元素及其有关接口{{domxref("HTMLCanvasElement")}}.</li> </ul>