canvas创建线性渐变

最新推荐文章于 2024-08-08 00:00:00 发布

hb707934728

最新推荐文章于 2024-08-08 00:00:00 发布

阅读量738

点赞数

分类专栏： Html5_学习笔记

本文链接：https://blog.csdn.net/hb707934728/article/details/69388761

版权

本文详细介绍了如何使用HTML5 canvas元素创建线性渐变效果，从基本概念到实践应用，包括设置渐变方向、颜色停止点和在画布上应用渐变的方法。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<!--		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-->
<html>
   <head>
     <title>Rectangles</title>
			<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
       <title>线性渐变</title>

      <style>
         #canvas {
            background: #eeeeee;
            border: thin solid cornflowerblue;
         }
      </style>
   </head>

   <body>
      <canvas id='canvas' width='450' height='275'>
         Canvas not supported
      </canvas>

      <script>
      	var canvas&#