HTML&JS笔记(2)
2013-12-13 12:02
267 查看
<!DOCTYPE html> <html> <body> <meta charset="utf-8"> <canvas id="myCanvas" width="500" height="500"> 你的浏览器不支持HTML5 </canvas> <P>你好,世界</p> <script type="text/javascript"> var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.lineWidth=10; ctx.strokeStyle="red"; ctx.lineCap="round"; ctx.beginPath(); ctx.moveTo(10,10); ctx.lineTo(150,50); ctx.stroke(); ctx.strokeRect(50,60,20,30); ctx.fillStyle="green"; ctx.beginPath(); ctx.fillRect(65,75,90,70); ctx.stroke(); ctx.lineWidth=3; ctx.strokeStyle="red"; ctx.beginPath(); ctx.arc(300,300,100,0,360*Math.PI/180,true); ctx.stroke(); ctx.beginPath(); ctx.arc(300,300,50,0,160*Math.PI/180,true); ctx.stroke(); ctx.lineWidth=2; ctx.fillStyle="red"; ctx.beginPath(); ctx.arc(150,150,60,0,360*Math.PI/180,true); ctx.fill(); </script> </body> </html>
画圆带填充功能:
本博客所有内容是原创,如果转载请注明来源
http://blog.csdn.net/myhaspl/
相关文章推荐
- HTML&JS&DOM笔记总纲
- Web前端-HF-HTML5Programming笔记-CH1&CH2 HTML5&JS&DOM
- 前端基础笔记HTML&CSS&JS
- HTML&JS笔记(1)
- HTML&JS 笔记(3)
- HTML&JS笔记(1)
- html&JS学习笔记(4)
- vue.js 源代码学习笔记 ----- html-parse.js
- HTML&CSS精选笔记_HTML与CSS网页设计概述
- HTML,JS, 笔记
- c#/asp.net/html/css/js/jquery 实用小方法 整理笔记
- 韩顺平_轻松搞定网页设计(html+css+javascript)_第23讲_js三大流程控制(顺序流程、分支控制、循环控制)_js调式技巧_学习笔记_源代码图解_PPT文档整理
- HTML&CSS基础学习笔记1.29-灵活地使用样式
- 乱七八糟的一堆js html笔记
- JS学习笔记(三):HTML通过ajax请求获取并显示php中的内容
- html之js笔记二
- javascript学习笔记--js对html对象的原生操作
- HTML&CSS基础学习笔记1.33-元素选择器
- WEB前端(HTML、XML、CSS、JS)学习笔记
- JS笔记04-BOM&(location+navigator)