HTML kanvas textAlign katangian
Definisyon at paggamit
textAlign Ang mga katangian ay naka-set o binabalik ang kasalukuyang paraan ng alining ng teksto ayon sa anchor.
Karaniwang magsisimula ang teksto mula sa naaangkin na posisyon, ngunit kung ito ay naka-set bilang textAlign="right" at itinayo sa posisyon 150, magtatapos ito sa posisyon 150.
Mga tipong balita:gumamit ng fillText() o strokeText() Ang mga paraan ay talagang ginagamit sa pagpipinta at paglokasyon ng teksto sa kanvas.
Mga halimbawa
Makita ang isang puting linya sa posisyon 150. Ang posisyon 150 ay ang anchor ng lahat ng teksto na itinakda sa ibaba. Pag-aralan ang epekto ng bawat halaga ng textAlign:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
// 在位置 150 创建蓝线
ctx.strokeStyle="blue";
ctx.moveTo(150,20);
ctx.lineTo(150,170);
ctx.stroke();
ctx.font="15px Arial";
// 显示不同的 textAlign 值
ctx.textAlign="start";
ctx.fillText("textAlign=start",150,60);
ctx.textAlign="end";
ctx.fillText("textAlign=end",150,80);
ctx.textAlign="left";
ctx.fillText("textAlign=left",150,100);
ctx.textAlign="center";
ctx.fillText("textAlign=center",150,120);
ctx.textAlign="right";
ctx.fillText("textAlign=right",150,140);
การใช้งาน
context.textAlign="center|end|left|right|start";
ค่าของแอตทริบิวต์
| ค่า | คำอธิบาย |
|---|---|
| start | ค่าเริ่มต้น。ข้อความเริ่มที่ที่กำหนด |
| end | ข้อความจบที่ที่กำหนด |
| center | จัดวางข้อความในตำแหน่งที่กำหนด |
| left | จัดวางข้อความขวาข้าง |
| right | จัดวางข้อความซ้ายข้าง |
รายละเอียดเทคนิค
| ค่าเริ่มต้น： | start |
|---|
การรองรับโปรแกรมนี้
ตัวเลขในตารางระบุสัปดาห์ที่รองรับคุณสมบัตินี้ให้ได้ทันที
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
หมายเหตุ：Internet Explorer 8 และตัวเลือกที่เก่ากว่าไม่สนับสนุนประกาย <canvas>
