Canvas textBaseline विशेषता

व्याख्या और उपयोग

textBaseline विशेषता ड्राइंग टेक्स्ट के दौरान मौजूदा टेक्स्ट बेस लाइन सेट करती या उसे वापस करती है।

नीचे चित्रण टेक्स्ट बेस लाइन गुण के समर्थित विभिन्न बेस लाइनों को दर्शाता है:

文本基线图示

टिप्पणी:fillText() या strokeText() कैनवस पर पाठ को स्थानित करते समय, निर्दिष्ट textBaseline मान का उपयोग किया जाएगा।

उदाहरण

नीले रंग से भरे चतुर्भुज को परिभाषित करें:

आपका ब्राउज़र कैनवस टैग को समर्थित नहीं करता।

जेसक्रिप्ट:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
// y=100 स्थान पर नीले रंग की लाइन ड्रा करें
ctx.strokeStyle="blue";
ctx.moveTo(5,100);
ctx.lineTo(395,100);
ctx.stroke();
ctx.font="20px Arial"
// y=200 पर विभिन्न textBaseline मानों के साथ प्रत्येक शब्द लगाएं
ctx.textBaseline="top";
ctx.fillText("Top",5,100);
ctx.textBaseline="bottom";
ctx.fillText("Bottom",50,100);
ctx.textBaseline="middle";
ctx.fillText("Middle",120,100);
ctx.textBaseline="alphabetic";
ctx.fillText("Alphabetic",190,100);
ctx.textBaseline="hanging";
ctx.fillText("Hanging",290,100);

स्वयं अभिप्राय करें

व्याकरण

परिप्रेक्ष्य.textBaseline="alphabetic|top|hanging|middle|ideographic|bottom";

गुण मान

मान वर्णन
alphabetic मूलभूत. पाठ बेस लाइन सामान्य अक्षर बेस लाइन है।
टॉप पाठ बेस लाइन em फ़ॉन्ट बॉक्स की ऊपर है।
हैंगिंग पाठ बेस लाइन लटकने वाली बेस लाइन है।
मिडल पाठ बेस लाइन em फ़ॉन्ट बॉक्स के मध्य है।
ideographic पाठ बेस लाइन अर्थवाहक बेस लाइन है।
बोटम पाठ बेस लाइन em फ़ॉन्ट बॉक्स की नीचे है।

तकनीकी विवरण

मूलभूत मान: alphabetic

ब्राउज़र समर्थन

तालिका में नंबरों में इस गुण को पूरी तरह से समर्थन देने वाले पहले ब्राउज़र का संस्करण उल्लेख किया गया है。

च्रोम एज फायरफॉक्स सैफारी ऑपेरा
च्रोम एज फायरफॉक्स सैफारी ऑपेरा
4.0 9.0 3.6 4.0 10.1

टिप्पणी:Internet Explorer 8 और अधिक पुरानी संस्करण <canvas> एलीमेंट को समर्थन नहीं देते हैं。