CSS text-align गुण
- पिछला पृष्ठ table-layout
- अगला पृष्ठ text-align-last
व्याख्या और उपयोग
text-align गुण एलिमेंट में टेक्स्ट के लिए आड़े से जस्तीयता निर्धारित करता है।
यह गुण बॉक्स एलिमेंट के अंदर टेक्स्ट के लिए किस बिन्दु के साथ आधार से तालमेल करता है इसके माध्यम से सेट करता है; लेख सामग्री में अक्षरों और शब्दों के बीच की अंतराल नियंत्रित करके जस्तीयन मूल्य का समर्थन कर सकता है; विभिन्न यूजर एजेंट्स को विभिन्न परिणाम मिल सकते हैं।
और देखें:
CSS शिक्षा:CSS टेक्स्ट
HTML DOM संदर्भ पुस्तकःtextAlign गुण
उदाहरण
h1, h2, h3 एलिमेंटों के लिए टेक्स्ट जस्तीयता सेट करना:
h1 {text-align:center;} h2 {text-align:left;} h3 {text-align:right;}
CSS व्याकरण
text-align: left|right|center|justify|initial|inherit;
गुण मूल्य
मूल्य | वर्णन |
---|---|
left | लेख बाईं ओर दर्शाया जाता है। मूलभूत मान: ब्राउज़र द्वारा निर्धारित। |
right | टेक्स्ट को दायाँ ओर रखना |
center | टेक्स्ट को मध्य में रखना |
justify | दो-तरफा जस्ता टेक्स्ट का प्रभाव देखाना |
inherit | पैर एलिमेंट के text-align विशेषता के मान को अनुसरण करना है। |
मान justify
अंतिम स्तर जस्ता विशेषता justify है जो अपने दोषों को लाता है।
मान justify का इस्तेमाल करके टेक्स्ट के दोनों अंतों को जस्ता किया जा सकता है। दो-तरफा जस्ता टेक्स्ट में, पंक्ति के दोनों अंत को पैर एलिमेंट के भीतरी सीमा पर रखा जाता है। फिर, शब्द और अक्षरों के बीच के अंतर को समान करके, सभी पंक्तियों की लंबाई को समान करने के लिए समायोजन किया जाता है। आपको ध्यान में रखना चाहिए कि दो-तरफा जस्ता टेक्स्ट छापने के क्षेत्र में बहुत आम है, लेकिन CSS में इसके लिए अधिक विचार करना चाहिए।
दो-तरफा जस्ता टेक्स्ट को आगे बढ़ाने के लिए, यूजर एजेंट (नहीं कि CSS) को निर्धारित करना है। उदाहरण के लिए, कुछ ब्राउज़र शब्दों के बीच के अंतर को बढ़ाते हैं, जबकि अन्य ब्राउज़र अक्षरों के बीच के अंतर को समान रूप से वितरित करते हैं (हालांकि CSS नियम विशेष रूप से कहता है कि यदि letter-spacing विशेषताएक लंबाई मान के रूप में निर्धारित किया जाता है ("यूजर एजेंट नहीं हो सकता कि अक्षरों के बीच के अंतर को आगे बढ़ाए या कम करे")। कुछ यूजर एजेंट भी कुछ पंक्तियों के अंतर को कम करके टेक्स्ट को अधिक घनी कर सकते हैं। सभी इस तरह के व्यवहार एलिमेंट के रूपाकार को प्रभावित करते हैं, यह एलिमेंट की ऊंचाई को भी प्रभावित कर सकता है, इसका प्रभाव यूजर एजेंट के जस्ता के आयामों पर निर्भर करता है।
CSS ने नाबाक्सी को कैसे संभालना निर्धारित नहीं किया है (टिप्पणी 1)। अधिकांश दो-तरफा जस्ता टेक्स्ट में नाबाक्सी को लंबे शब्द को दो पंक्तियों में बांटकर इसे छोटा करने के लिए इस्तेमाल किया जाता है, इससे शब्दों के बीच के अंतर को कम करने और टेक्स्ट पंक्ति के रूपाकार को सुधारने के लिए। हालांकि, नाबाक्सी के व्यवहार को CSS द्वारा निर्धारित न होने के कारण, यूजर एजेंट ऑटोमेटिक रूप से नाबाक्सी जोड़ने की संभावना कम है। इसलिए, CSS में दो-तरफा जस्ता टेक्स्ट अच्छी तरह से प्रिंट नहीं होता, विशेष रूप से जब एलिमेंट बहुत छोटा होता है तब इसमें प्रत्येक पंक्ति में केवल कुछ शब्द ही रहते हैं। नाममात्र छोटे डिजाइन एलिमेंट का इस्तेमाल कर सकते हैं, लेकिन इसके दोषों को ध्यान में रखना चाहिए।
टिप्पणी 1:CSS में नाबाक्सी का होने का वर्णन नहीं है क्योंकि विभिन्न भाषाओं में नाबाक्सी के नियम अलग-अलग हैं। नियमों में कोई प्रयास नहीं किया गया है कि ऐसे संभवतः अधूरे नियमों को एकजुट किया जाए, वहीं इस सवाल को सिर्फ छोड़ दिया गया है。
तकनीकी विवरण
मूलभूत मूल्य: | अगर direction विशेषता ltr है, तो मूलभूत मूल्य left है; अगर direction rtl है, तो right है。 |
---|---|
विरासतीयता: | हाँ |
संस्करण: | CSS1 |
जावास्क्रिप्ट ग्रामर: | ऑब्जेक्ट.style.textAlign="right" |
अधिक उदाहरण
- टेक्स्ट जस्ता करना
- इस उदाहरण में आपको पढ़ने के लिए टेक्स्ट कैसे जस्ता करने का प्रदर्शन किया गया है。
ब्राउज़र समर्थन
तालिका में नम्बर कोड को पूरी तरह से समर्थन करने वाले पहले ब्राउज़र का संस्करण दर्शाया गया है。
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
1.0 | 3.0 | 1.0 | 1.0 | 3.5 |
- पिछला पृष्ठ table-layout
- अगला पृष्ठ text-align-last