HTML 参考手册

HTML 标签大全

HTML: <template> etiqueta

HTML canvas stroke() 方法

HTML canvas的stroke()方法用于绘制路径。使用moveTo()和lineTo()方法绘制此路径。

Manual de referência do canvas HTML

在线示例

绘制一条路径，形状是蓝色的字母 L再画一条竖线：

JavaScript：

示例

!DOCTYPE　html>
<html>
<head>
<meta　charset="utf-8>
<title>HTML　canvas　stroke()方法使用-基础教程(oldtoolbag.com)</title>
</head>
<body>
<canvas　id="myCanvas"　width="300"　height="150"　style="border:1px　solid　#d3d3d3>
您的浏览器不支持　HTML5　canvas　标签。
</canvas>
<script>
var　c=document.getElementById("myCanvas");
var　ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.lineTo(20,100);
ctx.lineTo(70,100);
ctx.strokeStyle="blue";
ctx.stroke();
ctx.beginPath();
ctx.moveTo(100,　200);
ctx.lineTo(100,　100);
ctx.strokeStyle = "blue";
ctx.stroke();
</script>　
</body>
</html>

Teste e veja ‹/›

Compatibilidade do navegador

IEFirefoxOperaChromeSafari

Internet Explorer 9Firefox, Opera, Chrome e Safari suportam stroke() Métodos.

Atenção:Internet Explorer 8 Versões anteriores ao <canvas> não suportam o elemento.

Definição e uso

O método stroke() desenha fisicamente o caminho definido pelos métodos moveTo() e lineTo(). A cor padrão é preta.

Dica:Use strokeStyle Propriedade para desenhar outra cor/Gradiente.

Sintaxe JavaScript:	context.stroke();

Manual de referência do canvas HTML

HTML: <template> etiqueta