HTML学习(2) canvas标签的使用五

Symbol

于 2012-08-17 16:23:29 发布

阅读量362

点赞数

分类专栏： HTML5 文章标签： html

本文链接：https://blog.csdn.net/wcf_szkingdom/article/details/7878048

版权

HTML5 专栏收录该内容

18 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML>
<body>
    <canvas id = "myCanvas" style="width:200px;height:200px;border:2px solid"></canvas>
    <script type="text/javascript">
        var obj = document.getElementById("myCanvas");
        var cxt = obj.getContext("2d");
        <!-- createLinearGradient() 方法创建一条线性颜色渐变 -- >
        <!-- createLinearGradient(xStart, yStart, xEnd, yEnd) -->
        var grd=cxt.createLinearGradient(0,0,200,200);
        
        <!-- addColorStop(offset, color) 方法在渐变中的某一点添加一个颜色变化 -->
        grd.addColorStop(0,"#FF0000");
        grd.addColorStop(1,"#0000FF");
        cxt.fillStyle=grd;
        cxt.fillRect(0,0,200,200);
    </script>
</body>

Symbol

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
HTML学习(2) canvas标签的使用五

var obj = document.getElementById("myCanvas"); var cxt = obj.getContext("2d"); var grd=cxt.createLinearGradient(0,0,200,200); grd.addColorSt
复制链接

扫一扫