HTML5 新增绘图功能
2015-07-03 20:21
549 查看
<!DOCTYPE html>
<html>
<head lang="en">
<title></title>
<meta charset="utf-8">
</head>
<body>
<h2>绘图入门</h2>
<canvas id="mc" width="300" height="180" style="border:1px solid black"></canvas>
<script type="text/javascript">
/*获取绘图DOM对象*/
var canvas = document.getElementById("mc");
/*获取绘图 CanvasRenderingContext2D对象*/
var ctx = canvas.getContext("2d");
/*设置填充颜色*/
ctx.fillStyle = "#f00";
/*绘制矩形*/
ctx.fillRect(30,40,80,100);
</script>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 跨终端实践-天猫试戴的解决方案
- html5 之 canvas 相关知识(三)API-strokeStyle-shadow相关
- html5新增标签
- 极客学院 HTML5
- 使用HTML5实现刮刮卡效果
- h5-localstorage-购物车
- 使用HTML5技术控制电脑或手机上的摄像头（转载）
- HTML5安全：内容安全策略（CSP）简介
- HTML5游戏设计与开发 小白7-9月的动态
- Html5笔记 表格 布局
- 完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法
- html5 离线存储
- 七款顶级HTML5编辑器带你飞
- 汉顺平html5课程分享：6小时制作经典的坦克大战！
- Netty4 之 简单搭建WebSocket服务
- HTML5初步——新的表单元素和属性
- HTML5的全局属性
- Html5的CSS3的transition实现简单动画效果
- 关于HTML5与移动开发
- 基于HTML5多图片Ajax上传可预览