<!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. VS2012中进行Web性能和负载测试

    问题1:无法使用ie进行录制 解决方法: 工具 >> 管理加载项 >> 在工具栏和扩展中找到发布者为Microsoft Corporation的Microsoft Web Te ...

  2. mysql 让一个存储过程定时作业的代码

    1.在mysql 中建立一个数据库 test1 语句:create database test1 2.创建表examinfo create table examinfo( id int auto_in ...

  3. JavaScript创建对象的写法

    JavaScript 有Date.Array.String等这样的内置对象,功能强大使用简单,人见人爱,但在处理一些复杂的逻辑的时候,内置对象就很无力了,往往需要开发者自定义对象.   对象是什么 从 ...

  4. Delphi XE5教程4：程序和单元概述

    内容源自Delphi XE5 UPDATE 2官方帮助<Delphi Reference>,本人水平有限,欢迎各位高人修正相关错误!也欢迎各位加入到Delphi学习资料汉化中来,有兴趣者可 ...

  5. 第27章 项目8：使用XML-RPC进行文件共享

    1.问题 创建一个简单的P2P文件共享程序. P2P文件共享程序是在不同计算机上的程序交换文件.P2P交互内,任何节点(peer)都可以是链接到其他节点.在这样一个由节点组成的虚拟网络中,是没有中央节 ...

  6. C语言的sizeof

    今天帮同学想用C实现数组的折半查找,本来算法挺简单的,可是折腾了好几个小时才发现问题在哪,这个sizeof坑人不浅啊. #include<stdio.h> void m(int []); ...

  7. db2查看表空间

    select substr(tbsp_name,1,20) as 表空间名称,substr(tbsp_content_type,1,10) as 表空间类型,sum(tbsp_total_size_k ...

  8. Python GUI编程实践

    看完了<python编程实践>对Python的基本语法有了一定的了解,加上认识到python在图形用户界面和数据库支持方面快捷,遂决定动手实践一番. 因为是刚接触Python,对于基本的数 ...

  9. thinkphp中curl的使用，常用于接口

    /lib/action/PublicAction.class.php class PublicAction extends Action{ //curl,返回数组 public function ge ...

  10. ZOJ 2314 带上下界的可行流

    对于无源汇问题,方法有两种. 1 从边的角度来处理. 新建超级源汇, 对于每一条有下界的边,x->y, 建立有向边 超级源->y ,容量为x->y下界,建立有向边 x-> 超级 ...