编程 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+dom树型菜单类，希望朋友们一起进步

May 03 Javascript

jQuery移动和复制dom节点实用DOM操作案例

Dec 17 Javascript

THREE.JS入门教程(4)创建粒子系统

Jan 24 Javascript

js格式化时间小结

Nov 03 Javascript

Jquery api 速查表分享

Jan 12 Javascript

Bootstrap Table服务器分页与在线编辑应用总结

Aug 08 Javascript

JQuery手速测试小游戏实现思路详解

Sep 20 Javascript

vue实现微信分享功能

Nov 28 Javascript

JavaScript查看代码运行效率console.time()与console.timeEnd()用法

Jan 18 Javascript

vue2.0+vue-router构建一个简单的列表页的示例代码

Feb 13 Javascript

ES10 特性的完整指南小结

Mar 04 Javascript

全局安装 Vue cli3 和继续使用 Vue-cli2.x操作

Sep 08 Javascript

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中用hash实现的数组

2011/07/17 PHP

PHP针对常规模板引擎中与CSS/JSON冲突的解决方法

2014/08/19 PHP

PHP处理数组和XML之间的互相转换

2016/06/02 PHP

基于thinkPHP实现的微信自定义分享功能示例

2016/09/23 PHP

yii2中LinkPager增加总页数和总记录数的实例

2017/08/28 PHP

javascript两种function的定义介绍及区别说明

2013/05/02 Javascript

js取float型小数点后两位数的方法

2014/01/18 Javascript

js从Cookies里面取值的简单实现

2014/06/30 Javascript

js实现飞入星星特效代码

2014/10/17 Javascript

浅谈NodeJS中require路径问题

2015/05/07 NodeJs

javascript与jquery动态创建html元素示例

2016/07/25 Javascript

js replace()去除代码中空格的实例

2017/02/14 Javascript

详解vue事件对象、冒泡、阻止默认行为

2017/03/20 Javascript

vue.js实现含搜索的多种复选框（附源码）

2017/03/23 Javascript

AngularJS中下拉框的基本用法示例

2017/10/11 Javascript

vue实现长图垂直居上 vue实现短图垂直居中

2017/10/18 Javascript

Vue.js组件间的循环引用方法示例

2017/12/27 Javascript

通过vue提供的keep-alive减少对服务器的请求次数

2018/04/01 Javascript

解决betterScroll在vue中存在图片时,出现拉不动的问题

2018/09/27 Javascript

微信小程序基于高德地图查找位置并显示文字

2019/10/30 Javascript

js实现一款简单踩白块小游戏(曾经很火)

2019/12/02 Javascript

[03:03]DOTA2 2017国际邀请赛开幕战队入场仪式

2017/08/09 DOTA

[00:36]TI7不朽珍藏III——斯温不朽展示

2017/07/15 DOTA

win7 下搭建sublime的python开发环境的配置方法

2014/06/18 Python

Python 实现简单的shell sed替换功能(实例讲解)

2017/09/29 Python

Python多进程池 multiprocessing Pool用法示例

2018/09/07 Python

Python装饰器限制函数运行时间超时则退出执行

2019/04/09 Python

python进度条显示-tqmd模块的实现示例

2020/08/23 Python

Python关于拓扑排序知识点讲解

2021/01/04 Python

使用Python封装excel操作指南

2021/01/29 Python

用CSS3将你的设计带入下个高度

2009/08/08 HTML / CSS

详解H5 活动页之移动端 REM 布局适配方法

2017/12/07 HTML / CSS

JavaScript实现页面动态验证码的实现示例

2021/03/23 Javascript

超市重阳节活动方案

2014/02/10 职场文书

奔腾年代观后感

2015/06/09 职场文书

浅谈resultMap的用法及关联结果集映射

2021/06/30 Java/Android