रिलेटिव लेंथ यूनिट्स
CSS में रिलेटिव लेंथ यूनिट्स किसी अन्य लेंथ प्रॉपर्टी के सापेक्ष लंबाई निर्दिष्ट करने के लिए उपयोग की जाती हैं।
| क्र. | यूनिट और विवरण |
|---|---|
| 1 | em एलिमेंट के font-size के सापेक्ष, यानी 4em का अर्थ है वर्तमान फ़ॉन्ट आकार का 4 गुना। |
| 2 | ex वर्तमान फ़ॉन्ट के x-height के सापेक्ष। |
| 3 | ch "0" अक्षर की चौड़ाई के सापेक्ष। |
| 4 | rem रूट एलिमेंट के font-size के सापेक्ष। |
| 5 | vw व्यूपोर्ट की चौड़ाई के 1% के सापेक्ष। |
| 6 | vh व्यूपोर्ट की ऊंचाई के 1% के सापेक्ष। |
| 7 | vmin व्यूपोर्ट के छोटे आयाम के 1% के सापेक्ष। |
| 8 | vmax व्यूपोर्ट के बड़े आयाम के 1% के सापेक्ष। |
| 9 | % पैरेंट एलिमेंट के सापेक्ष। |
उदाहरण 1: em यूनिट
<!DOCTYPE html>
<html>
<head>
<style>
.demo { text-decoration: overline underline; text-decoration-color: blue; font-size: 1.4em; }
</style>
</head>
<body>
<h1>Details</h1>
<p class="demo">Examination Center near ABC College.</p>
<p class="demo2">Exam begins at 9AM.</p>
</body>
</html>
आउटपुट
उदाहरण 2: ch यूनिट
<!DOCTYPE html>
<html>
<head>
<style>
.demo { text-decoration: overline underline; text-decoration-color: blue; font-size: 4ch; }
</style>
</head>
<body>
<h1>Details</h1>
<p class="demo">Examination Center near ABC College.</p>
<p class="demo2">Exam begins at 9AM.</p>
</body>
</html>
आउटपुट
