HTML कैनवास टेक्स्टसंपत्ति संरेखित करें
उदाहरण
स्थिति 150 में एक लाल रेखा बनाएँ। स्थिति 150 नीचे दिए गए उदाहरण में परिभाषित सभी पाठों के लिए लंगर बिंदु है। प्रत्येक पाठ के प्रभाव का अध्ययन करें संपत्ति मूल्य संरेखित करें:
जावास्क्रिप्ट:
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
// Create a red line in position 150
ctx.strokeStyle = "red";
ctx.moveTo(150, 20);
ctx.lineTo(150, 170);
ctx.stroke();
ctx.font = "15px Arial";
// Show the different textAlign values
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);
ब्राउज़र समर्थन
तालिका में संख्याएं पहले ब्राउज़र संस्करण को निर्दिष्ट करती हैं जो पूरी तरह से संपत्ति का समर्थन करता है।
| Property | |||||
|---|---|---|---|---|---|
| textAlign | Yes | 9.0 | Yes | Yes | Yes |
परिभाषा और उपयोग
टेक्स्ट एलाइन प्रॉपर्टी एंकर पॉइंट के अनुसार टेक्स्ट सामग्री के लिए वर्तमान संरेखण सेट या लौटाती है।
आम तौर पर, टेक्स्ट निर्दिष्ट स्थिति में शुरू होगा , हालांकि, यदि आप टेक्स्ट एलाइन = "दाएं" सेट करते हैं और टेक्स्ट को 150 की स्थिति में रखते हैं, तो इसका मतलब है कि टेक्स्ट 150 की स्थिति में समाप्त होना चाहिए ।
युक्ति: कैनवास पर टेक्स्ट को वास्तव में आकर्षित करने और स्थान देने के लिए fillText() या स्ट्रोकText() विधि का उपयोग करें।
| डिफ़ॉल्ट मान: | शुरु |
|---|---|
| जावास्क्रिप्ट सिंटैक्स: | संदर्भ .textAlign="center|end|left|right|start"; |
सम्पत्ति की कीमत
| Values | Description | Play it |
|---|---|---|
| start | Default. The text starts at the specified position | |
| end | The text ends at the specified position | |
| center | The center of the text is placed at the specified position | |
| left | The text starts at the specified position | |
| right | The text ends at the specified position |
❮ HTML कैनवास संदर्भ