要设置笔触颜色HTML5 Canvas的文本,我们可以使用的strokeStyle画布的背景和strokeText()方法。
context.strokeStyle=[value]; context.strokeText("Hello World!", x, y); 先看下个例子:
<!DOCTYPE HTML> <html> <head> <title>html5_canvas_text_stroke</title> <style> body {margin: 0px;padding: 0px;} #myCanvas {border: 1px solid #9C9898; margin:0 auto;margin-top:200px; margin-left:100px;} </style> <script> window.onload = function(){ var canvas = document.getElementById("myCanvas"); var context = canvas.getContext("2d");
var x = 80; var y = 110; context.font = "60pt Calibri";
context.lineWidth = 3; context.strokeStyle = "blue"; // stroke color context.strokeText("Hello World!", x, y); }; </script> </head> <body> <canvas id="myCanvas" width="578" height="200"> </canvas> </body> </html>
|