使用CSS3的@font-face嵌入字体后,怎样在HTML5中的CANVAS调用
展开全部
<!doctype html>
<style type="text/css" media="screen, print">
@font-face {
font-family: "Automania";
src: url("Automania.ttf");
}
</style>
<script type="text/javascript">
function draw() {
var ctx = document.getElementById('shuipai').getContext('2d');
var img = new Image();
img.onload = function(){
ctx.drawImage(img,0,0);
ctx.beginPath();
ctx.fillStyle = '#000';
ctx.font = "60px Automania";
ctx.textBaseline = 'top';
ctx.fillText('what this font looks', 0, 5);
ctx.stroke();
}
img.src = 'http://dotnet.aspx.cc/Images/logoSite.gif';
}
</script>
<body>
<input onclick="draw()" type="button" value="test" />
<canvas id="shuipai" width="800" height="400"></canvas>
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询