En son web geliştirme öğreticiler
 

HTML canvas strokeStyle Propery

<Tuval Nesne

Örnek

bir dikdörtgen çizin. kırmızı bir vuruş renk kullanın:

YourbrowserdoesnotsupporttheHTML5canvastag.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeStyle="#FF0000";
ctx.strokeRect(20,20,150,100);
Kendin dene "

Tarayıcı Desteği

Tablodaki rakamlar tam özelliğini destekleyen ilk tarayıcı sürümü belirtin.

özellik
strokeStyle 4.0 9.0 3.6 4.0 10.1

Tanımı ve Kullanımı

strokeStyle özelliği, ayarlar veya vuruş için kullanılan renk, gradyan veya desen döndürür.

Varsayılan değer: # 000000
JavaScript sözdizimi: context .strokeStyle= color | gradient | pattern ;

Mülkiyet Değerler

değer Açıklama Oynat
color Bir CSS renk değeri çekme stroku rengini belirtir. Varsayılan değer # 000000 olduğunu Oynat "
gradient Bir gradyan nesnesi ( doğrusal ya da radyal ) bir gradyan kontur oluşturmak için kullanılan
pattern Bir model amacı, bir model kontur oluşturmak için kullanılan

Örnekler

Diğer Örnekler

Örnek

bir dikdörtgen çizin. Bir gradyan felç kullanın:

YourbrowserdoesnotsupporttheHTML5canvastag.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");

var gradient=ctx.createLinearGradient(0,0,170,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");

// Fill with gradient
ctx.strokeStyle=gradient;
ctx.lineWidth=5;
ctx.strokeRect(20,20,150,100);
Kendin dene "

Örnek

Metin yazın "Big smile!" Bir gradyan inmeli:

YourbrowserdoesnotsupporttheHTML5canvastag.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");

ctx.font="30px Verdana";
// Create gradient
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// Fill with gradient
ctx.strokeStyle=gradient;
ctx.strokeText("Big smile!",10,50);
Kendin dene "

<Tuval Nesne