canvas

作者: 岩蔷薇 | 来源:发表于2017-03-21 10:44 被阅读0次

    1. 什么是canvas

    • HTML5提供的一种新标签, ie9才开始支持的
    • canvas是一个矩形区域的画布,可以用JS控制每一个像素在上面绘画。
    • canvas 标签使用 JavaScript 在网页上绘制图像,本身不具备绘图功能。
    • canvas 拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法.

    2 标签语法和属性

    • 单位: px,可以设置width和height属性,否则忽略单位。
    • width和hegiht:默认300*150像素(一般情况下都要手动设置width和height)
    • 注意
    • 不要用CSS控制它的宽和高,会导致内部图片被拉伸
    • 重新设置canvas标签的宽高属性会让画布擦除所有的内容,
    • 可以给canvas画布设置背景色

    3 浏览器不兼容处理

    • ie9以上才支持canvas, 其他chrome、Safari、Opera等都支持

    • 只要浏览器兼容canvas,那么就会支持绝大部分api(个别最新api除外)

    • 移动设备几乎支持canvas的所有API

    • 2d的支持的都非常好,3d(webgl)ie11才支持,其他都支持

    • 如果浏览器不兼容,最好进行友好提示, 例如

        <canvas id="canvas">
        你的浏览器不支持canvas,请升级浏览器.浏览器不支持,显示此行文本
        </canvas>
      
    • 如果浏览器不兼容,可以使用flash等方式进行替换。

    相关文章

      网友评论

          本文标题:canvas

          本文链接:https://www.haomeiwen.com/subject/wswwnttx.html