本篇教程探讨了HTML5 Canvas图片填充样式讲解,希望阅读本篇文章以后大家有所收获,帮助大家HTML5+CSS3从入门到精通 。
<
html>
canvas
*{
margin:0;
padding:0;
outline:none;
border:none;
}
#canvas{
width:7rem;
margin:.25rem001.5rem;
border:1pxsolidblack;
}
/**
*rem布局初始化
*/
$(‘html‘).css(‘font-size‘,$(window).width()/10);
/**
*获取canvas画布
*获取canvas绘图上下文环境
*/
varcanvas=$(‘#canvas‘)[0];
varcxt=canvas.getContext(‘2d‘);
/**
*创建图片填充样式
*一:createPattern(图片对象,重复方式)
*二:createPattern(canvas对象,重复方式)
*三:createPattern(视频对象,重复方式)
*/
/*
varimg=newImage();
img.src="../img/favicon.ico";
img.onload=function(){