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> एलीमेंट को समर्थन नहीं देते हैं。