<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

        <script type="text/javascript">

            window.onload = function()

            {

                var obj = document.getElementById("CVS");

                var context = obj.getContext("2d");

                context.lineWidth = 10;

                context.strokeStyle = "aqua";

                context.lineCap = "round";

                context.moveTo(10,10);

                context.lineTo(400,20);

                context.lineTo(200,100);

                context.fillStyle = "blanchedalmond";

                context.fill();

                //context.lineTo(10,10);

                context.closePath();

                context.stroke();

            }

        </script>

    </head>

    <body>

        <canvas id="CVS" width="600px" height="400px" style="border:5px dotted blue;">

        </canvas>

    </body>

</html>

HTML5入门1---Canvas画布的更多相关文章

  1. HTML5入门十一---Canvas画布实现画图（二）

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. HTML5入门十---Canvas画布实现画图（一）

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. HTML5入门九---Canvas画布

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. HTML5 中的 canvas 画布（一）

    ---恢复内容开始--- 在HTML5中新添加的元素,canvas 现在支持 IE9+的版本 注意:HTML5 <canvas> 元素用于图形的绘制,通过脚本 (通常是JavaScript ...

  5. HTML5 中的 canvas 画布（二）

    绘制图片 一.绘制图片 context.drawImage()(即把图片放到canvas里) var image = new Image();  // 先创建图片对象 image.src = '图片的 ...

  6. 用html5的canvas画布绘制贝塞尔曲线

    查看效果:http://keleyi.com/keleyi/phtml/html5/7.htm 完整代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHT ...

  7. 自学HTML5第四节（canvas画布详解）

    canvas画布好像可是说是HTML5的精华了,一定要学好,嗯嗯,绚丽的东西就要从基础的开始.... 先看看啥玩意叫做canvas 什么是 Canvas? HTML5 的 canvas 元素使用 Ja ...

  8. HTML5入门以及新标签

    HTML5 学习总结(一)--HTML5入门与新增标签   目录 一.HTML5概要 1.1.为什么需要HTML5 1.2.什么是HTML5 1.3.HTML5现状及浏览器支持 1.4.HTML5特性 ...

  9. HTML5学习总结——canvas绘制象棋(canvas绘图)

    一.HTML5学习总结——canvas绘制象棋 1.第一次:canvas绘制象棋(笨方法)示例代码: <!DOCTYPE html> <html> <head> & ...

  10. 推荐10个适合初学者的 HTML5 入门教程

    HTML5 作为下一代网站开发技术,无论你是一个 Web 开发人员或者想探索新的平台的游戏开发者,都值得去研究.借助尖端功能,技术和 API,HTML5 允许你创建响应性.创新性.互动性以及令人惊叹的 ...

随机推荐

  1. Hbase 0.95.2介绍及下载地址

    HBase是一个分布式的.面向列的开源数据库,该技术来源于Google论文“Bigtable:一个结构化数据的分布式存储系统”.就像Bigtable利用了Google文件系统(File System) ...

  2. js中(function(){…})()立即执行函数写法理解（转载oschina）

    ( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到 ...

  3. Golang学习笔记

    一.基础 1. Hello World程序 demo: package main import "fmt" // 注释 //注释 func main() { fmt.Printf( ...

  4. SQL的自增列如何重置

    第一种方法:首先去除该列自增的标识,然后再修改id的值,成功修改后,再加上自增标识:如果不修改自增标识,会报错:“无法更新标识列”. 第二种方法:删除该自增列,而后重建一个自增列.

  5. RDD的转换操作---RDD转换过程

    1) union(otherRDD)RDD-->UnionRDD2) groupByKey(numPartitions)RDD-->ShuffledRDD-->MapPartitio ...

  6. python之内置类型: 序列, 字典

    序列: 元素之类有序的类型. Python 2.x支持6种内置序列: list, tuple, string, ustring, buffer, xrange (1)序列的定义: list: [] t ...

  7. Go学习指南

    学习Golang书籍&资料: 1. The Go Programming Language Specification:  http://golang.org/ref/spec 2. How ...

  8. C/C++ 内联函数

    内联函数具备一般函数的性质,但是不需要调用,而是在编译阶段,会用函数体替换函数名被调用的地方.可以节省调用时间(进出栈.保存上下文). 在编译层面和宏的作用相同.内联函数的展开在编译阶段,宏展开在预处 ...

  9. Oracle 存储过程实例2

    --创建存储过程 CREATE OR REPLACE PROCEDURE xxxxxxxxxxx_p ( --参数IN表示输入参数,OUT表示输入参数,类型可以使用任意Oracle中的合法类型. is ...

  10. python学习小结1：for循环控制语句

    用一个列表来确定for循环的范围 >>> x = [0,1,2,3,4] >>> for i in x: print i, 0 1 2 3 4  循环一个字符串 & ...