Pregled code-a:
<!DOCTYPE HTML> <html lang="hr"> <head> <meta charset="UTF-8"> <title>CANVAS - fillStyle i strokeStyle</title> <script> var can, ctx; function init() { can = document.getElementById('kan1'); if (can.getContext) { ctx = can.getContext('2d'); //function loader drawTriangle(); } else document.getElementById('kan11').innerHTML='Vaš browser ne podržava CANVAS tag!'; } function drawTriangle() { //styles ctx.lineWidth = 3; ctx.strokeStyle = '#F89947'; ctx.fillStyle = '#01A7E1'; //stroke ctx.moveTo(20,20); ctx.lineTo(150,20); ctx.lineTo(150,150); ctx.closePath(); ctx.stroke(); //fill ctx.fill(); } window.onload=init; </script> </head> <body> Upotreba <b>strokeStyle</b> i <b>fillStyle</b>.<br> <canvas id="kan1" width="300" height="200" style="border:1px solid #DDDDDD;background:#ABD160;"> <span id="kan11">Vaš browser ne podržava CANVAS element!</span> </canvas> <br><br> </body> </html>
Pregled stranice:
Pogledaj stranicu
../html/html5canvas/primjeri/40strokestyle_fillstyle.html
.