Canvas strokeStyle 属性
ການອະທິບາຍແລະການນຳໃຊ້
strokeStyle
ຄູ່ມືທີ່ກຳນົດຫຼືການກະທຳສຳລັບສີ, ສີສັນຍານການເຕັມພາບ, ຫຼືວິດຕະພັນການເຕັມພາບ.
ກໍານົດຄັ້ງ
ກໍານົດຄັ້ງ 1
ຂຽນຟອກຄັ້ງ. ນຳໃຊ້ສີຂອງການເຕັມພາບດີ:
JavaScript:
var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.strokeStyle="#0000ff"; ctx.strokeRect(20,20,150,100);
ຂອບຂອງການໃຊ້
context.strokeStyle=color|gradient|pattern;
ຄູ່ມືອິດສະຫຼະ
ຄູ່ມືອິດສະຫຼະ | ອະທິບາຍ |
---|---|
color | ສະແດງສີຂອງການເຕັມພາບບູໄຊີລາວ. ຄູ່ມືສີຄະແນນ CSS). ຄູ່ມືອິດສະຫຼະແມ່ນ #000000. |
gradient | ໂອບລາວທີ່ນຳໃຊ້ເພື່ອການເຕັມພາບຂອງການຂຽນພາບ(ທີ່ຍາງຫຼືຫຼັງການປ່ຽນວຽກ) |
pattern | ໂອບລາວທີ່ນຳໃຊ້ເພື່ອສ້າງສີສັນຍານການເຕັມພາບບູໄຊີລາວ. |
ຂໍ້ມູນດ້ານເຕັກນິກ
ຄູ່ມືອິດສະຫຼະ | #000000 |
---|
ຫຼາຍກໍານົດຄັ້ງອື່ນ
ກໍານົດຄັ້ງທີ 2
ຂຽນຟອກຄັ້ງ. ນຳໃຊ້ການນຳໃຊ້ສີສັນຍານການເຕັມພາບ:
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"); // ນຳໃຊ້ສີສັນຍານການເຕັມພາບ ctx.strokeStyle=gradient; ctx.lineWidth=5; ctx.strokeRect(20,20,150,100);
ກໍານົດຄັ້ງທີ 3
ຂຽນຂໍ້ຄວາມ "codew3c.com" ດ້ວຍການນຳໃຊ້ສີສັນຍານການເຕັມພາບ:
JavaScript:
var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.font="30px Verdana"; // ສ້າງສີສັນຍານການເຕັມພາບ var gradient=ctx.createLinearGradient(0,0,c.width,0); gradient.addColorStop("0","magenta"); gradient.addColorStop("0.5","blue"); gradient.addColorStop("1.0","red"); // ນຳໃຊ້ສີສັນຍານການເຕັມພາບ ctx.strokeStyle=gradient; ctx.strokeText("Big smile!",10,50);
ການສະໜັບສະໜູນບູໄຊີລາວ
ຕົວແທນທີ່ລະບຸວ່າການສະແດງຂອງຊາວບູໄດ້ສະໜັບສະໜູນແບບລະບຸທີ່ພົບຕົວຢູ່ໃນການຫຼິ້ນງານ.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
ຄວາມເຫັນ:Internet Explorer 8 ແລະຫຼັງນັ້ນບໍ່ສາມາດສະໜັບສະໜູນ <canvas> element.