HTML中的SVG（Scalable Vector Graphics，可縮放矢量圖形）元素是一種用于在網頁上創建圖形的強大工具。其中矩形是一種常用的元素之一，可以用來表示不同的圖形和色塊，下面我們來看一下矩形的HTML SVG代碼如何編寫。

<svg width="200" height="100">
<rect x="50" y="20" width="100" height="50" fill="blue" />
</svg>

上面的代碼描述了一個長寬分別為100和50像素的藍色矩形，其中x和y屬性定義了矩形的位置，fill屬性定義了矩形的填充顏色。更具體的定義方式如下：

• x：表示矩形左側邊緣距離SVG元素左側邊緣的距離
• y：表示矩形上側邊緣距離SVG元素上側邊緣的距離
• width：表示矩形的寬度
• height：表示矩形的高度
• fill：表示矩形的填充顏色，可以使用顏色名稱、十六進制值或rgb值

此外，還可以通過stroke屬性定義矩形的邊框顏色和寬度，以及使用rx和ry屬性創建圓角矩形。通過在rect元素中設置這些屬性值，可以創建出各式各樣的矩形，為網頁提供更加生動的可視化效果。