HTML寬度屬性


<canvas> 元素的 width 屬性用於設定 canvas 的寬度(畫素)。以下是語法 -

<canvas width="pixels_val">

其中,pixels_val 是以畫素為單位的寬度。下面我們來看一個實現 <canvas> 元素 width 屬性的示例 -

示例

 實際演示

<!DOCTYPE html>
<html>
<body>
<canvas id="newCanvas" width="400" height="200" style="border:3px dashed yellow">
HTML5 canvas tag isn't supported by your browser.
</canvas>
<script>
   var c = document.getElementById("newCanvas");
   var context = c.getContext("2d");
   context.fillStyle = "#FF5655";
   context.fillRect(100, 50, 60, 100);
</script>
</body>
</html>

輸出

在上例中,我們建立了一個 canvas 並使用了 JavaScript -

<script>
   var c = document.getElementById("newCanvas");
   var context = c.getContext("2d");
   context.fillStyle = "#FF5655";
   context.fillRect(100, 50, 60, 100);
</script>

在此之前,我們已經設定了 canvas id 以及寬度和高度 -

<canvas id="newCanvas" width="400" height="200" style="border:3px dashed yellow">
   HTML5 canvas tag isn't supported by your browser.
</canvas>

更新於: 30-7-2019

127 人次瀏覽

啟動你的 職業生涯

完成課程並獲得認證

開始吧
廣告