编程 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 相关文章推荐

JavaScript国旗变换效果代码

Aug 13 Javascript

JavaScript 定义function的三种方式小结

Oct 16 Javascript

在Javascript里访问SharePoint列表数据的实现方法

May 22 Javascript

在Node.js中实现文件复制的方法和实例

Jun 05 Javascript

jQuery Real Person验证码插件防止表单自动提交

Nov 06 Javascript

jQuery购物车插件jsorder用法(支持后台处理程序直接转换成DataTable处理)

Jun 08 Javascript

Node.js中常规的文件操作总结

Oct 13 Javascript

AngularJS操作键值对象类似java的hashmap(填坑小结)

Nov 12 Javascript

JS中去掉array中重复元素的方法

May 26 Javascript

JavaScript模板引擎原理与用法详解

Dec 24 Javascript

selenium 反爬虫之跳过淘宝滑块验证功能的实现代码

Aug 27 Javascript

如何在vue 中引入使用jquery

Nov 10 jQuery

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脚本的10个技巧(8)

2006/10/09 PHP

PHP 程序员的调试技术小结

2009/11/15 PHP

Laravel 5 框架入门（四）完结篇

2015/04/09 PHP

对比PHP对MySQL的缓冲查询和无缓冲查询

2016/07/01 PHP

PHP crypt()函数的用法讲解

2019/02/15 PHP

jquery trim() 功能源代码

2011/02/14 Javascript

JavaScript之自定义类型

2012/05/04 Javascript

用unescape反编码得出汉字示例

2014/04/24 Javascript

JS获取各种宽度、高度的简单介绍

2014/12/19 Javascript

js关于命名空间的函数实例

2015/02/05 Javascript

jquery操作select元素和option的实例代码

2016/02/03 Javascript

Javascript获取随机数的实现方法

2016/06/22 Javascript

JavaScript String(字符串)对象的简单实例(推荐)

2016/08/31 Javascript

基于angularjs实现图片放大镜效果

2016/08/31 Javascript

浅谈vue中数据双向绑定的实现原理

2017/09/14 Javascript

thinkjs 文件上传功能实例代码

2017/11/08 Javascript

在react-router4中进行代码拆分的方法（基于webpack）

2018/03/08 Javascript

vue-cli 3.x 配置Axios(proxyTable)跨域代理方法

2018/09/19 Javascript

axios对请求各种异常情况处理的封装方法

2018/09/25 Javascript

JS使用百度地图API自动获取地址和经纬度操作示例

2019/04/16 Javascript

Python动态加载模块的3种方法

2014/11/22 Python

安装好Pycharm后如何配置Python解释器简易教程

2019/06/28 Python

Python正则表达式匹配日期与时间的方法

2019/07/07 Python

Django model select的多种用法详解

2019/07/16 Python

Python操作SQLite数据库过程解析

2019/09/02 Python

PyQt5+Pycharm安装和配置图文教程详解

2020/03/24 Python

Python itertools.product方法代码实例

2020/03/27 Python

Django创建一个后台的基本步骤记录

2020/10/02 Python

浅析PyCharm 的初始设置（知道）

2020/10/12 Python

html5指南-4.使用Geolocation实现定位功能

2013/01/07 HTML / CSS

Chupi官网：在爱尔兰手工制作的订婚、结婚戒指和精美珠宝

2020/09/28 全球购物

致短跑运动员广播稿

2014/01/09 职场文书

优秀班集体事迹材料

2014/12/25 职场文书

预备党员考察意见范文

2015/06/01 职场文书

传单、海报早OUT了，另类传单营销方案送给你！

2019/07/15 职场文书

Java实现二维数组和稀疏数组之间的转换

2021/06/27 Java/Android