
canvas
文章平均质量分 73
canvas可以在页面中设定一个区域,再利用JavaScript动态地绘制图像
Serena_tz
write less,do better️️️
展开
-
canvas基础
1 canvas基本用法1.1 什么是canvas(画布)<canvas> 是 HTML5 新增的元素,可用于通过使用JavaScript中的脚本来绘制图形。例如,它可以用于绘制图形,创建动画。【注意】:使用<canvas>标签时,建议要成对出现,不要使用闭合的形式。canvas元素默认具有高宽。width: 300px;height:150px。1.2 替换内容<canvas>很容易定义一些替代内容。由于某些较老的浏览器(尤其是IE9之前的IE浏览器)原创 2021-04-30 08:55:18 · 413 阅读 · 0 评论 -
HTML5 内联 SVG 图形
浏览器支持Internet Explorer 9、Firefox、Opera、Chrome 以及 Safari 支持内联 SVG。把 SVG 直接嵌入 HTML 页面在 HTML5 中,您能够将 SVG 元素直接嵌入 HTML 页面中:<!DOCTYPE html><html><body><svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190"> <polyg转载 2021-03-12 15:23:56 · 179 阅读 · 0 评论 -
Vue实现随机验证码功能
步骤1 创建一个名为identify.vue的子组件<template> <div class="s-canvas"> <canvas id="s-canvas" :width="contentWidth" :height="contentHeight"></canvas> </div></template><script>export default { name: 'SIdentify', props原创 2020-12-28 15:09:06 · 1926 阅读 · 12 评论 -
用canvas画七彩虹伞
彩虹小伞效果图如下:代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>作业1</title> <style> #can原创 2020-09-21 16:47:03 · 2372 阅读 · 5 评论 -
用canvas画一个简易的机器猫头像
用canvas画一个机器猫的头像,原图如下:代码实现效果如下:代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>作业2</title> <原创 2020-09-21 16:41:47 · 926 阅读 · 0 评论