أحدث البرامج التعليمية وتطوير الشبكة
 

HTML canvas strokeStyle Propery

<HTML قماش المرجعي

مثال

رسم مستطيل. استخدام لون السكتة الدماغية الأحمر:

YourbrowserdoesnotsupporttheHTML5canvastag.

جافا سكريبت:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeStyle="#FF0000";
ctx.strokeRect(20,20,150,100);
انها محاولة لنفسك »

دعم المتصفح

الأرقام في الجدول تحدد أول نسخة متصفح يدعم بشكل كامل العقار.

الملكية
strokeStyle نعم فعلا تسعة نعم فعلا نعم فعلا نعم فعلا

تعريف واستخدام

مجموعات الملكية strokeStyle أو إرجاع اللون، التدرج، أو نمط استخدامها لالسكتات الدماغية.

القيمة الافتراضية: # 000000
جافا سكريبت بناء الجملة: context.strokeStyle=color|gradient|pattern;

قيم الملكية

القيمة وصف العبها
color و قيمة اللون CSS الذي يشير إلى لون الحد من الرسم. القيمة الافتراضية هي #000000 العبها "
gradient كائن التدرج ( linear أو radial ) تستخدم لخلق السكتة الدماغية الانحدار
pattern و pattern كائن تستخدم لخلق نمط السكتة الدماغية

المزيد من الأمثلة

مثال

رسم مستطيل. استخدام السكتة الدماغية التدرج:

YourbrowserdoesnotsupporttheHTML5canvastag.

جافا سكريبت:

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);
انها محاولة لنفسك »

مثال

كتابة نص "Big smile!" ، مع السكتة الدماغية التدرج:

YourbrowserdoesnotsupporttheHTML5canvastag.

جافا سكريبت:

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);
انها محاولة لنفسك »

<HTML قماش المرجعي