Canvas lineCap 屬性
示例
繪製具有圓角的線段
JavaScript
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.lineCap = "round";
ctx.moveTo(20, 20);
ctx.lineTo(20, 200);
ctx.stroke();
自己動手試一試 »
描述
lineCap 屬性設定或返回線段端點的樣式。
合法值：butt (預設), round, 和 square。
注意
round 和 square 值會使線段稍微變長。
另請參閱
lineCap 屬性 (設定端點樣式)
lineJoin 屬性（設定連線帽）
lineWidth 屬性 (設定連線點樣式)
fillStyle 屬性 (設定填充顏色/樣式)
strokeStyle 屬性 (設定描邊顏色/樣式)
語法
| context.lineCap = "butt|round|square" |
屬性值
| 值 | 描述 | 試一試 |
|---|---|---|
| butt | 線段末端的平直邊緣 | 試一試 » |
| round | 線段末端的圓角 | 試一試 » |
| square | 線段末端的方角 | 試一試 » |
瀏覽器支援
<canvas> 元素是 HTML5 標準（2014）。
lineCap 在所有現代瀏覽器中都受支援
| Chrome | Edge | Firefox | Safari | Opera | IE |
| 是 | 是 | 是 | 是 | 是 | 9-11 |
❮ Canvas 參考
