美文网首页
html5(2)

html5(2)

作者: w_01 | 来源:发表于2017-06-25 23:32 被阅读0次
    canvas:画布
    getContext('2d'):绘图对象
    stroRect(x,y,width,height):不填充颜色,边框默认黑色
    fillRect(x,y,width,height):默认填充黑色,无边框
    clearRect(x,y,width,height):清除制定画布
    fillStyle:设置填充色,先设置颜色
    strokeStyle:设置边框颜色,先设置
    lineWidth:设置边框宽度,先设置
    line='round'设置边界连接样式  圆角
    line='bevel'设置边界连接样式  斜角

    画线
    moveTo(x,y):起始点
    lineTo(x,y):结束点
    stroke():绘制路径
    fill():填充路径
    beginPath():开始绘制路径
    closePath():结束绘制

    画圆
    arc(x,y,半径,起始弧度,结束弧度,旋转方向)
    x,y为圆心点
    弧度=角度*Math.PI/180

    drawImage()设置图片 三个属性img,x,y
        五个属性img,x,y,width,height
        九个属性img,sx,sy,swidth,sheight,x,y,width,height
    createPattern() 设置背景 两个属性img,平铺方式
    createLinearGradient(x,y,x2,y2)线性渐变
    createRadialGradient(x1,y1,r1,x2,y2,r2) 放射性渐变
    strokeText(文字,x,y,) 空心文本
    fillText(文字,x,y,) 实心文本
    font='大小 字体'
    textAlign左右对齐方式
    textBaseLine上下对齐方式
    measureText(文本) 文本宽度
    shadowOffsetX,shadowOffsetY 文本阴影X和Y轴偏移
    shadowBlur 高斯模糊
    shadowColor 阴影颜色

相关文章

  • 常用问题总结

    2 html5新特性,html5为什么要写 (1)用于绘画的 canvas 元素(2)...

  • 前端优秀网站

    设计### HTML5 UP! Responsive HTML5 and CSS3 Site Templates2...

  • html5 Canvas画图5:曲线之arc

    本文属于《html5 Canvas画图系列教程》 在《html5 Canvas画图教程2:Canvas画线条 基础...

  • 前端小白必知的相关书籍

    一、HTML篇 1)《精通HTML》 2)《HTML5秘籍》 3)《HTML5权威指南》 4)《Head Firs...

  • H5

    H5学习链接 如何使用HTML5 1>自己编写大量的HTML5代码 2>使用现成的HTML5框架 1 nsench...

  • HTML5页面规范(一)

    一.什么是HTML5 概念及优势 二.HTML5主要包括部分 三.HTML5页面规范 1.废除的标签 2.HTML...

  • HTML面试真题

    1、doctype的意义是什么 2、HTML XHTML HTML5的关系 3、HTML5有什么变化 新的语义...

  • HTML5错题总结

    1. HTML5 之前的 HTML 版本是什么? 正确答案:HTML 4.01 2. HTML5 的正确 doct...

  • html5+css3 部分

    (1)css盒模型(2)html5的新特性(3)对html5的语义话的理解(4)cookie,sessionSto...

  • HTML5 表单属性

    HTML5 新的表单属性HTML5的 和 标签添加了几个新的属性新属性:1.autocomplete2...

网友评论

      本文标题:html5(2)

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