แท็ก HTML5
ในการวาดรูปสี่เหลี่ยมผืนผ้าด้วยผ้าใบ HTML5 ให้ใช้เมธอด fillRect(x, y, width, height):
คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อเรียนรู้วิธีวาดสี่เหลี่ยมผืนผ้าด้วย HTML5 Canvas
ตัวอย่าง
<!DOCTYPE html> <html> <head> <title>HTML5 Canvas Tag</title> </head> <body> <canvas id="newCanvas" width="200" height="100" style="border:1px solid #000000;"></canvas> <script> var c = document.getElementById('newCanvas'); var ctx = c.getContext('2d'); ctx.fillStyle = '#7cce2b'; ctx.fillRect(0,0,300,100); </script> </body> </html>
ผลลัพธ์