CSS का उपयोग करके वर्ड स्पेसिंग

word-spacing प्रॉपर्टी

शब्दों के बीच स्पेसिंग सेट करने के लिए word-spacing प्रॉपर्टी का उपयोग करें।

सिंटैक्स:

word-spacing: normal | length | initial | inherit;

मान:

• normal: डिफ़ॉल्ट शब्द स्पेसिंग (आमतौर पर 0.25em)
• length: अतिरिक्त स्पेस (px, em, rem, cm, आदि)। नकारात्मक मान अनुमत।

उदाहरण 1: सामान्य vs अतिरिक्त स्पेसिंग

<!DOCTYPE html>
<html>
<head>
<style>
p.demo1 { word-spacing: normal; }
p.demo2 { word-spacing: 10px; }
</style>
</head>
<body>
<h1>डेमो हेडिंग</h1>
<h2>सामान्य स्पेसिंग</h2>
<p class="demo1">यह डेमो टेक्स्ट है।</p>
<h2>10px अतिरिक्त स्पेसिंग</h2>
<p class="demo2">यह डेमो टेक्स्ट है।</p>
</body>
</html>

उदाहरण 2: बड़ी स्पेसिंग (cm और px)

<!DOCTYPE html>
<html>
<head>
<style>
p.demo1 { word-spacing: 3cm; }
p.demo2 { word-spacing: 40px; }
</style>
</head>
<body>
<h1>डेमो हेडिंग</h1>
<h2>3cm स्पेसिंग</h2>
<p class="demo1">यह डेमो टेक्स्ट है।</p>
<h2>40px स्पेसिंग</h2>
<p class="demo2">यह डेमो टेक्स्ट है।</p>
</body>
</html>

word-spacing vs letter-spacing:

उपयोग के मामले:

• हेडिंग्स में दृश्य प्रभाव के लिए बढ़ी स्पेसिंग
• कॉम्पैक्ट लेआउट्स के लिए नकारात्मक स्पेसिंग (सावधानी से)
• text-align: justify के साथ फाइन-ट्यूनिंग
• डिज़ाइन सिस्टम में टाइपोग्राफी स्केल

एक्सेसिबिलिटी नोट:

अत्यधिक word-spacing पठनीयता कम कर सकता है, विशेषकर डिस्लेक्सिया वाले उपयोगकर्ताओं के लिए। WCAG 1.4.12 (टेक्स्ट स्पेसिंग) की आवश्यकता है कि उपयोगकर्ता शब्द स्पेसिंग को कम से कम 0.16 गुना फॉन्ट साइज़ तक बढ़ा सकें।

CSS Text Module Level 4:

/* भविष्य: text-spacing प्रॉपर्टी */
text-spacing: trim-start;  /* लाइन शुरू में स्पेस ट्रिम */
text-spacing: space-first; /* पहली लाइन इंडेंट */