您好!欢迎来到静学网! 注册 登入

  • 静学网专注SEO优化技术视频教程案例分析、算法知识,在这里免费学习到最新的SEO技术,让你轻松通往SEO高工程师级之路,全新的SEO算法将在这里得到解剖。同时静学网提供网站开发、app开发、移动开发、电商、自媒体、行业资讯等内容,丰富及弥补自己的知识体系,让你在未来更具有竞争力。

最详细的<canvas> 标签的属性及用法讲解

SEO视频 卢育永 次浏览
<canvas> 标签本身是没有什么作用的,但是结合其他属性对象,特别利用js进行控制,能就别具一格了,当前所有主流的浏览器都是支持<canvas> 标签的,因此利用价值还是不错的,canvas只是为了客户矢量图形而设计的, 本身没有具体使用方向,但值得庆幸的是能用js脚本进行绘制,能够在这个标签上显示。这个标签的定义是图形,它只是一个容器,一个图形容器,必须用其他语言控制。当然这个标签实际上在DOM对象中还是比较复杂的,其方法还是比较多的。其一般属性有height和width。
 
代码示例:

<!DOCTYPE html>
<html>
<head>
<title>Throw-Try-Catch</title>
</head>
<body >
<canvas id="myCanvas" style="height: 200px; width: 200px; border:1px solid #00e">练习CANVAS</canvas>
 
 <hr>
 <!--js部分-->
 <script type="text/javascript">
  var canvas=document.getElementById('myCanvas');
    var ctx=canvas.getContext("2d");//这是一个当前唯一的合法值是 "2d",它指定了二维绘图,并且导致这个方法返回一个环境对象,该对象导出一个二维绘图 API。
    
    ctx.fillStyle ='#000091';//图形颜色
 
    ctx.fillRect(0,0,200,200);//rect(左边距,上边距,矩形长,矩形宽)
 
 </script>
 
</body>
</html>

 canvas标签
 
当然canvas标签属性及方法是非常多的,有时间可给大家一一讲解,更多问题请咨询。



静学网 , 版权所有丨如未注明 , 均为原创丨转载请注明最详细的<canvas> 标签的属性及用法讲解
顶一下
(0)
0%
踩一下
(0)
0%
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
用户名: 验证码:点击我更换图片
合作伙伴:
SEO 关键词排名 SEO优化