पाठ-अभिविन्यास - सीएसएस-ट्रिक्स

text-orientationजब एक ऊर्ध्वाधर के साथ काम करने के लिए एक लाइन में सीएसएस संरेखित पाठ में संपत्ति writing-mode। मूल रूप से, यह या तो 90 ° दक्षिणावर्त द्वारा रेखा को घुमाता है ताकि यह नियंत्रित किया जा सके कि ऊर्ध्वाधर भाषाएं कैसे प्रदर्शित होती हैं - जैसे कि text-combine-uprightएक ऊर्ध्वाधर स्क्रिप्ट में पाठ की एक पंक्ति के भीतर वर्णों के समूहों को घुमाता है, लेकिन पाठ की पूरी लाइनों के लिए।

.element ( text-orientation: mixed; writing-mode: vertical-rl; )

द्वि-दिशात्मक पाठ को संभालने के लिए - एक ऐसा ब्लॉक जिसमें बाएँ-से-दाएँ और दाएँ-से-बाएँ दोनों पाठ होते हैं, उदाहरण के लिए - unicode-bidiसंपत्ति की जाँच करें । यह उस directionसंपत्ति के साथ संयुक्त है जिससे यह पता लगाया जा सकता है कि ब्राउज़र पाठ को कैसे प्रदर्शित करता है।

वाक्य - विन्यास

text-orientation: mixed | upright | sideways

प्रारंभिक: mixed
इस पर लागू होता है: तालिका पंक्ति समूहों, पंक्तियों, स्तंभ समूहों और स्तंभों को छोड़कर सभी तत्व
इन्हेरिटेड: हाँ
प्रतिशत: n / a
कंप्यूटेड वैल्यू: निर्दिष्ट मूल्य
एनीमेशन प्रकार: एनिमेट नहीं है

मूल्यों

/* Keyword values */ text-orientation: mixed; /* default */ text-orientation: upright; text-orientation: sideways; text-orientation: sideways-right; /* Global values */ text-orientation: inherit; text-orientation: initial; /* mixed */ text-orientation: unset;

mixed: डिफ़ॉल्ट मान। एक क्षैतिज स्क्रिप्ट में वर्ण 90 ° दक्षिणावर्त घुमाए जाते हैं। एक ऊर्ध्वाधर स्क्रिप्ट में वर्ण अपने प्राकृतिक ऊर्ध्वाधर अभिविन्यास में प्रदर्शित होते हैं।
upright: एक क्षैतिज लिपि में वर्ण अपनी प्राकृतिक क्षैतिज स्थिति में स्थित होते हैं, जिसमें कुछ ग्लिफ़ भी शामिल होते हैं। इसलिए, जहां एक ऊर्ध्वाधर लेखन मोड में पाठ की एक पंक्ति घुमाई जा सकती है ताकि अक्षर बग़ल में हों, यह मान वर्णों को उनकी प्राकृतिक स्थिति में 90 ° तक घुमाएगा। ध्यान दें कि यह मान directionसंपत्ति को उपयोग किए गए मूल्य के लिए मजबूर करता है ltr, जिसका अर्थ है कि सभी वर्णों को माना जाता है जैसे कि वे बाएं से दाएं लेखन मोड में हैं।
sideways: एक ऊर्ध्वाधर लेखन मोड में सभी पाठ बग़ल में प्रदर्शित होते हैं, जैसे कि यह एक क्षैतिज लेआउट में था, लेकिन पूरी पंक्ति 90 ° दक्षिणावर्त घुमाई जाती है।
sideways-right: कुछ ब्राउज़र इस मान को sidewaysपश्च-संगतता के लिए रखे गए मान के लिए एक उपनाम के रूप में सम्मान करते हैं ।

use-glyph-orientationदिसंबर 2015 में एक कीवर्ड मान के रूप में हटा दिया गया था। इसका उपयोग SVG तत्वों पर SVG गुणों को परिभाषित करने के लिए किया गया था glyph-orientation-verticalऔर glyph-orientation-horizontalजो अब हटाए गए हैं। glyph-orientation-verticalअब के लिए एक उपनाम है text-orientation।

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

यह ब्राउज़र सपोर्ट डेटा Caniuse का है, जिसमें अधिक विवरण हैं। एक संख्या इंगित करती है कि ब्राउज़र उस संस्करण और ऊपर की सुविधा का समर्थन करता है।

डेस्कटॉप

क्रोम	फ़ायर्फ़ॉक्स	अर्थात	एज	सफारी
४ 48	४१	नहीं न	। ९	10.1 *

मोबाइल / टेबलेट

Android क्रोम	Android फ़ायरफ़ॉक्स	एंड्रॉयड	iOS सफारी
88	.५	81	10.0-10.2

विनिर्देश

सीएसएस लेखन मोड स्तर 3 (संपादक का मसौदा)

अधिक जानकारी

क्यों ऊर्ध्वाधर पाठ अभिविन्यास क्रॉस ब्राउज़र संगतता के लिए एक बुरा सपना है? निखिल द्वारा - का text-orientationऔर गहन विवरण writing-mode।
Adi Purdila द्वारा “राइटिंग-मोड” CSS प्रॉपर्टी का उपयोग करके आसानी से साइडवेज़ टेक्स्ट बनाएं - उपयोग करने के अलावा विभिन्न तरीकों का अन्वेषण करें text-orientation।
WS Toh द्वारा CSS में वर्टिकल टेक्स्ट बनाने के 2 तरीके - उपयोग करने के तरीकों writing-modeऔर के बीच एक अधिक प्रत्यक्ष तुलना text-orientation।
क्रिस Coyier द्वारा पाठ रोटेशन - का उपयोग कर खड़ी पाठ करने के लिए एक दृष्टिकोण transformके बजाय writing-modeया text-orientation।