पाठ-संरेखण - सीएसएस-ट्रिक्स

Anonim

text-alignसीएसएस में संपत्ति एक ब्लॉक तत्व के भीतरी सामग्री संरेखित के लिए प्रयोग किया जाता है।

p ( text-align: center; )

ये पाठ-संरेखण के लिए पारंपरिक मूल्य हैं:

  • left- डिफ़ॉल्ट मान। सामग्री बाईं ओर के साथ संरेखित होती है।
  • right - सामग्री दाईं ओर संरेखित होती है।
  • center- बाएं और दाएं किनारों के बीच सामग्री केंद्र। प्रत्येक पंक्ति के बाईं और दाईं ओर का सफेद स्थान बराबर होना चाहिए।
  • justify - कंटेंट स्पेस ऐसे कि जितने संभव हो उतने ब्लॉक एक लाइन पर फिट हों और उस लाइन पर पहला शब्द लेफ्ट एज के साथ हो और आखिरी शब्द राइट एज के साथ हो।
  • inherit - मूल तत्व जो है उसका मूल्य होगा।

"सामग्री" का उपयोग यहां "पाठ" के बजाय शब्द के रूप में किया जाता है, क्योंकि पाठ-संरेखण निश्चित रूप से पाठ को प्रभावित करता है, यह उस कंटेनर में सभी इनलाइन या इनलाइन-ब्लॉक तत्वों को प्रभावित करता है।

CSS3 में भी दो नए मूल्य हैं, शुरू और अंत। ये मान एकाधिक भाषा समर्थन को आसान बनाते हैं उदाहरण के लिए, अंग्रेज़ी एक बाएँ से दाएँ (ltr) भाषा है और अरबी दाएँ-से-बाएँ (rtl) भाषा है। मूल्यों के लिए "दाएं" और "बाएं" का उपयोग करना बहुत कठोर है और दिशा परिवर्तन के रूप में अनुकूलित नहीं करता है। ये नए मूल्य अनुकूलन करते हैं:

  • start - ltr में "बाएँ" के समान, rtl में "दाएँ" के समान।
  • end - ltr में "दाएँ" के समान, rtl में "बाएँ" के समान।

ऐसा भी है match-parent, जो समान है inherit, केवल नए मूल्य की गणना वर्तमान तत्व की दिशा के बजाय की जाती है, आप जानते हैं कि ऐसा नहीं कर रहे हैं।

कल्पना में कुछ चीजें हैं जिनके पास अभी तक कोई ब्राउज़र समर्थन नहीं है। एक मूल्य "स्टार्ट एंड" है जो पहली लाइन को "इनिशिय" और किसी भी बाद की लाईन के रूप में यदि वह "एंड" है, को संरेखित करेगा। एक और मान एक स्ट्रिंग दे रहा है, जैसे text-align: "." start;कि पाठ उस की पहली घटना के साथ-साथ एक दशमलव बिंदु के साथ संख्याओं के एक कॉलम को पंक्तिबद्ध करने के लिए बदल देगा।

उदाहरण

यह पाठ संरेखित है।

यह पाठ संरेखित है।

मैं केंद्रित हूँ!

मैं न्यायपूर्ण हूं। मैं स्थान को बिल्कुल (अंतिम पंक्ति को छोड़कर) भरता हूं, भले ही मुझे कई बार थोड़ा खिंचाव करना पड़े।

मुझे अपने माता-पिता के संरेखण की विरासत मिली है। इस मामले में, इसका मतलब है कि छोड़ दिया।

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

बाएं, दाएं, केंद्र के लिए, औचित्य:

क्रोम सफारी फ़ायर्फ़ॉक्स ओपेरा अर्थात एंड्रॉयड आईओएस
कोई कोई कोई 3.5+ है 3+ कोई कोई

के लिए startऔर endमान:

क्रोम सफारी फ़ायर्फ़ॉक्स ओपेरा अर्थात एंड्रॉयड आईओएस
कोई 3.1+ 3.6+ है कोई नहीं कोई नहीं कोई कोई