Canvas lineWidth 屬性
示例
繪製一條 10 畫素寬的lineWidth線
JavaScript
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.lineWidth = 10;
// 開始一個新的路徑
ctx.beginPath();
ctx.moveTo(0, 100);
ctx.lineTo(200, 100);
// 繪製路徑
ctx.stroke();
自己動手試一試 »
更多示例見下文。
描述
lineWidth 屬性設定或返回當前線條的寬度（以畫素為單位）。
預設值為 1 畫素。
另請參閱
strokeStyle 屬性 (設定描邊顏色/樣式)
beginPath() 方法 (開始一個新路徑)
moveTo() 方法 （將路徑移動到指定點）
lineTo() 方法 （向路徑新增一條線）
stroke() 方法 (繪製當前路徑)
strokeRect() 方法 (繪製一個矩形)
語法
| context.lineWidth = number |
屬性值
| 值 | 描述 | 試一試 |
|---|---|---|
| 數字 | 當前線條的寬度（以畫素為單位） | 試一試 » |
示例
繪製一個 10 畫素寬的lineWidth矩形
JavaScript
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.lineWidth = 10;
ctx.strokeRect(20, 20, 80, 100);
自己動手試一試 »
瀏覽器支援
<canvas> 元素是 HTML5 標準（2014）。
lineWidth 在所有現代瀏覽器中都受支援
| Chrome | Edge | Firefox | Safari | Opera | IE |
| 是 | 是 | 是 | 是 | 是 | 9-11 |
❮ Canvas 參考
