随笔分类 -  canvas

canvas实例--手写签名
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ margin:0; padding:0; } body,html{ height:100%; overflow 阅读全文
posted @ 2020-08-19 15:00 花未眠0619 阅读(237) 评论(0) 推荐(0)
canvas实例--单像素操作
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ margin:0; padding:0; } body,html{ height:100%; overflow 阅读全文
posted @ 2020-08-19 14:45 花未眠0619 阅读(157) 评论(0) 推荐(0)
canvas实例--马赛克矩形
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ margin:0; padding:0; } body,html{ height:100%; overflow 阅读全文
posted @ 2020-08-19 14:40 花未眠0619 阅读(190) 评论(0) 推荐(0)
canvas实例--飞鸟
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ margin:0; padding:0; } html,body{ height: 100%; overflo 阅读全文
posted @ 2020-08-18 20:24 花未眠0619 阅读(201) 评论(0) 推荐(1)
canvas实例--钟表
摘要：1. 初始化：将圆心调整到画布中间 由于canvas中画圆与旋转所参照的坐标轴系于正常坐标系有出入 将整个画布逆时针旋转90° 初始化一些样式数据： ctx.lineWidth=8; ctx.strokeStyle="black"; ctx.lineCap="round"; 2. 外层空心圆盘 圆盘 阅读全文
posted @ 2020-08-18 15:35 花未眠0619 阅读(163) 评论(0) 推荐(0)
Canvas基础
摘要：Canvas 1. canvas元素默认具有高宽：width：300px;height：150px; 2. 替换内容 由于某些较老的浏览器不支持Canvas，所有利用替代内容；支持canvas的浏览器将会忽略在容器中包含的内容，并且只是正常渲染canvas；不支持canvas的浏览器会显示替换内容 阅读全文
posted @ 2020-08-18 08:18 花未眠0619 阅读(312) 评论(0) 推荐(0)