编程 Javascript

js+html5实现canvas绘制简单矩形的方法

Posted in Javascript onJune 05, 2015

本文实例讲述了js+html5实现canvas绘制简单矩形的方法。分享给大家供大家参考。具体实现方法如下：

<!DOCTYPE html>
<html>
<body>
<canvas id="myCanvas" width="200" height="100"
style="border:1px solid #c3c3c3;">
Your browser does not support the HTML5 canvas tag.
</canvas>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="#FF0000";
ctx.fillRect(0,0,150,75);
</script>
</body>
</html>

希望本文所述对大家的web程序设计有所帮助。

- Author -

不吃皮蛋

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

js压缩利器

Feb 20 Javascript

javascript 异步页面查询实现代码(asp.net)

May 26 Javascript

JS 日期比较大小的简单实例

Jan 13 Javascript

JavaScript bold方法入门实例（把指定文字显示为粗体）

Oct 17 Javascript

js仿微博实现统计字符和本地存储功能

Dec 22 Javascript

省市二级联动小案例讲解

Jul 24 Javascript

Vue数据驱动模拟实现1

Jan 11 Javascript

详解微信小程序 wx.uploadFile 的编码坑

Jan 23 Javascript

xmlplus组件设计系列之路由（ViewStack)（7）

May 02 Javascript

jQuery实现的页面遮罩层功能示例【测试可用】

Oct 14 jQuery

ant design pro中可控的筛选和排序实例

Nov 17 Javascript

vue实现滑动解锁功能

Mar 03 Vue.js

js+html5实现canvas绘制镂空字体文本的方法

Jun 05 #Javascript

js+html5通过canvas指定开始和结束点绘制线条的方法

Jun 05 #Javascript

js+HTML5实现canvas多种颜色渐变效果的方法

Jun 05 #Javascript

JavaSacript中charCodeAt()方法的使用详解

Jun 05 #Javascript

JavaScript中length属性的使用方法

Jun 05 #Javascript

jQuery插件bgStretcher.js实现全屏背景特效

Jun 05 #Javascript

js+html5绘制图片到canvas的方法

Jun 05 #Javascript

You might like

日常整理PHP中简单的图形处理(经典)

2015/10/26 PHP

PHP附件下载中文名称乱码的解决方法

2015/12/17 PHP

php将print_r处理后的数据还原为原始数组的解决方法

2016/11/02 PHP

Laravel程序架构设计思路之使用动作类

2018/06/07 PHP

心扬JS分页函数代码

2010/09/10 Javascript

根据经纬度计算地球上两点之间的距离js实现代码

2013/03/05 Javascript

javascript中常用编程知识

2013/04/08 Javascript

教你如何使用PHP输出中文JSON字符串

2014/05/22 Javascript

jQuery 1.9移除了$.browser可以使用$.support来替代

2014/09/03 Javascript

JavaScript中字符串分割函数split用法实例

2015/04/07 Javascript

JS实现的页面自定义滚动条效果

2015/10/26 Javascript

js判断图片加载完成后获取图片实际宽高的方法

2016/02/25 Javascript

一道关于JavaScript变量作用域的面试题

2016/03/08 Javascript

jQuery绑定事件on()与弹窗的简要概述

2016/04/27 Javascript

javascript对象的相关操作小结

2016/05/16 Javascript

Bootstrap零基础入门教程(二)

2016/07/18 Javascript

实例分析浏览器中“JavaScript解析器”的工作原理

2016/12/12 Javascript

jquery 正整数数字校验正则表达式

2017/01/10 Javascript

jQuery遍历节点方法汇总(推荐)

2017/05/13 jQuery

Vue-Cli中自定义过滤器的实现代码

2017/08/12 Javascript

vue中引入mxGraph的步骤详解

2019/05/17 Javascript

vue.js watch经常失效的场景与解决方案

2021/01/07 Vue.js

[56:21]LGD vs IG 2018国际邀请赛小组赛BO2 第二场 8.18

2018/08/19 DOTA

Django的session中对于用户验证的支持

2015/07/23 Python

Python3 修改默认环境的方法

2019/02/16 Python

pytorch 利用lstm做mnist手写数字识别分类的实例

2020/01/10 Python

阿波罗盒子：Apollo Box

2017/08/14 全球购物

以设计师精品品质提供快速时尚：PopJulia

2018/01/09 全球购物

2014年大学生就业规划书

2014/04/04 职场文书

正科级干部考察材料

2014/05/29 职场文书

分公司经理任命书

2014/06/05 职场文书

大一学生个人总结

2015/02/15 职场文书

社区宣传标语口号

2015/12/26 职场文书

《女娲补天》教学反思

2016/02/20 职场文书

（开源）微信小程序+mqtt，esp8266温湿度读取

2021/04/02 Javascript

深入详解JS函数的柯里化

2021/06/09 Javascript