writing-modeसंपत्ति पाठ के संरेखण में परिवर्तन इतना है कि यह ऊपर से नीचे तक पढ़ा जा सकता है या से भाषा के आधार पर सही करने के लिए छोड़ दिया है,। उदाहरण के लिए, मान लें कि हम कुछ पाठ जोड़ना चाहते हैं जो ऊपर से नीचे तक और दाएँ से बाएँ, इस तरह से पढ़ा जाता है:
.vertical-rl ( writing-mode: vertical-rl; )पेन राइटिंग-मोड देखें: CodePen पर CSS-Tricks (@ css-tricks) द्वारा वर्टिकल-आरएल।
यह चीनी, जापानी या कोरियाई भाषाओं में सबसे उपयोगी है जहां पाठ अक्सर लंबवत सेट किया जाता है। अंग्रेजी भाषा में, यह अधिक संभावना है कि आप इस संपत्ति का उपयोग सौंदर्यशास्त्र के कारणों के लिए करना चाहते हैं, जैसे कि इस तरह के टेक्स्ट के ब्लॉक में हेडिंग को संरेखित करना:
CodePen पर CSS-Tricks (@ css-tricks) द्वारा पेन YWBWGA देखें।
मूल्यों
नीचे दिए गए उदाहरणों में मैंने पाठ का पहला अक्षर लाल कर दिया है, बस यह देखना आसान है कि आपको किस दिशा में पढ़ना शुरू करना है।
क्षैतिज- tb
यह संपत्ति का डिफ़ॉल्ट मान है: पाठ को बाएं से दाएं और ऊपर से नीचे तक पढ़ा जाता है।
पेन राइटिंग-मोड देखें: कोडपैन पर सीएसएस-ट्रिक्स (@ सीएसएस-ट्रिक्स) द्वारा क्षैतिज-टीबी।
ऊर्ध्वाधर-आरएल
पाठ को दाएं से बाएं और ऊपर से नीचे तक पढ़ा जाता है:
पेन राइटिंग-मोड देखें: CodePen पर CSS-Tricks (@ css-tricks) द्वारा वर्टिकल-आरएल।
लंबवत- lr
पाठ बाएं से दाएं और ऊपर से नीचे तक पढ़ा जाता है:
पेन राइटिंग-मोड देखें: CodePen पर CSS-Tricks (@ css-tricks) द्वारा वर्टिकल-आरएल।
सम्बंधित लिंक्स
- CSS3 लेखन मोड के साथ कार्यक्षेत्र पाठ
- लेखन-विधा पर अहमद शदीद
ब्राउज़र का समर्थन
यह ब्राउज़र सपोर्ट डेटा Caniuse का है, जिसमें अधिक विवरण हैं। एक संख्या इंगित करती है कि ब्राउज़र उस संस्करण और ऊपर की सुविधा का समर्थन करता है।
डेस्कटॉप
| क्रोम | फ़ायर्फ़ॉक्स | अर्थात | एज | सफारी |
|---|---|---|---|---|
| 8 * | ४१ | 1 1 | १२ | 5.1 * |
मोबाइल / टेबलेट
| Android क्रोम | Android फ़ायरफ़ॉक्स | एंड्रॉयड | iOS सफारी |
|---|---|---|---|
| 88 | .५ | 3 * | 5.0-5.1 * |