隨著 HTML5 的普及，動態圖形已經成為了一個非常流行的選擇。與傳統的圖形不同，HTML5 動態圖形可以通過一些簡單的代碼就能夠創建出來，無需掌握過多的繁瑣技巧。下面是一些簡單的 HTML5 動態圖形代碼示例，使用了 pre 標簽以展示代碼：

<canvas id="myCanvas" width="200" height="100"></canvas>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.fillStyle = "#FF0000";
ctx.fillRect(0, 0, 150, 75);
</script>

上述代碼使用了 HTML5 的 canvas 元素來創建一個矩形，可以通過在腳本中修改參數來創建任意大小和顏色的矩形。

<canvas id="myCanvas" width="200" height="100"></canvas>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.arc(100, 50, 30, 0, 2 * Math.PI);
ctx.stroke();
</script>

這段代碼創建了一個圓形，同樣可以通過修改參數來創建任意大小和顏色的圓形。注意，我們在這里使用了 stroke 方法來繪制圓形輪廓，而不是 fill 方法。

<canvas id="myCanvas" width="200" height="100"></canvas>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.font = "30px Arial";
ctx.fillText("Hello World", 10, 50);
</script>

最后一個例子展示了如何在 canvas 上繪制文本。在這里，我們使用了 fillText 方法來寫入文本內容。

以上是一些簡單的 HTML5 動態圖形代碼示例，你可以用它們作為起點來創建更復雜的圖形和動畫。希望這些代碼能幫助你入門 HTML5 動態圖形編程。