Question

在JavaScript中，是否可以在fillStyle中使用任何类型的stroke()？这是我的代码：

var text = document.getElementById("text");
var first = text.getContext("2d");
first.font = "100px SimLLHP";
first.strokeStyle = "blue";
first.strokeText("T1",100,100);
var last = text.getContext("2d");
last.font = "100px SimLLHP";
last.strokeStyle = "blue";
last.strokeText("T2",110,180)

Answer 1

不，不是。 stroke和fill都有自己的属性和方法，以便在HTML5 Canvas上绘图。 stroke用于轮廓，例如轮廓或线条。 fill用于实体形状。因此fillStyle仅用于填充，strokeStyle用于填充。没有理由混合它们。

因此，如果您想填写文字，我们只需将fillStyle与fillText一起使用。

var last = text.getContext("2d");
last.font = "100px SimLLHP";
last.fillStyle = "blue";
last.fillText("T2",110,180)

Fiddle 1

假设我们希望它被填充并有一个大纲，那么我们首先fill然后stroke。

// I hope you don't mind me using "ctx", it's the most common.
var ctx = text.getContext("2d");
ctx.font = "100px SimLLHP";
ctx.fillStyle = "blue";
ctx.fillText("T2",10,100);
ctx.strokeStyle = "red";
ctx.strokeText("T2",10,100);

Fiddle 2

JavaScript fillStyle可用于stroke（）吗？

1 个答案: