21xrx.com
2024-12-19 11:40:01 Thursday
登录
  

HTML5 canvas画布

2 2
2 2

HTML的<canvas>元素用来在网页上绘制图形.

左边的图形都是用<canvas>绘制的.显示了四个元素:红色的矩形,渐变矩形,多颜色矩形,五彩斑斓的文字.

HTML的canvas是什么?

HTML的<canvas>元素用来绘制图形,通常用脚本进行绘制(一般用JavaScript).

<canvas>元素只是图形的一个容器.事实上你必须用脚本来绘制图形.

canvas有好几种方法来绘制路径.盒子,圆形,文字和添加图片.

canvas例子

canvas是HTML页面中的一块矩形区域.默认情况下,canvas没有边框和内容.

标签看起来像这样:

注意:要一直指定id属性(在脚本里获取元素需要使用),还要指定canvas的宽度和高度.

添加边框,可以用style属性:

基本的canvas例子:

用JavaScript绘制:

绘制线条:

绘制圆:

绘制文字:

文字描边:

绘制线性渐变:

绘制圆形渐变:

绘制图片:

HTMLcanvas教程

学习HTML的<canvas>完整教程,请访问我们完整的HTML canvas教程

  
  

评论区

{{item['qq_nickname']}}
()
回复
回复
21技术    www.21xrx.com 备案号:蜀ICP备17043188号-2