CSS निरपेक्ष और सापेक्ष इकाइयों को समझना

<घंटा/>

CSS निरपेक्ष इकाइयाँ

निरपेक्ष लंबाई की इकाइयाँ एक दूसरे के संबंध में तय की जाती हैं। इन इकाइयों का उपयोग तब किया जाता है जब आउटपुट स्वरूप पहले से ही ज्ञात हो। निरपेक्ष लंबाई की कुछ इकाइयाँ निम्नलिखित हैं -

<वें शैली ="चौड़ाई:88.7074%; पाठ-संरेखण:केंद्र;">इकाई और विवरण

Sr.No
1	सेमी सेंटीमीटर
2	मिमी मिलीमीटर
3	इन इंच (1in =96px =2.54cm)
4	px * पिक्सेल (1px =1/96 1in का)
5	pt अंक (1pt =1/72 का 1in)
6	पीसी <मजबूत> पिकास (1पीसी =12 पीटी)

उदाहरण

आइए अब एक उदाहरण देखें -

<!DOCTYPE html>
<html>
<head>
<style>
.demo {
   text-decoration: overline underline;
   text-decoration-color: blue;
   font-size: 0.3in;
}
</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>

आउटपुट

CSS निरपेक्ष और सापेक्ष इकाइयों को समझना

CSS सापेक्ष इकाइयाँ

सीएसएस में सापेक्ष लंबाई इकाइयों का उपयोग किसी अन्य लंबाई संपत्ति के सापेक्ष लंबाई निर्दिष्ट करने के लिए किया जाता है।

वर्तमान फ़ॉन्ट की x-ऊंचाई के सापेक्ष

Sr.no	इकाई और विवरण
1	उन्हें तत्व के फ़ॉन्ट-आकार के सापेक्ष यानी 4em का अर्थ वर्तमान फ़ॉन्ट के आकार का 4 गुना है।
2	पूर्व वर्तमान फ़ॉन्ट की x-ऊंचाई के सापेक्ष
3	ch 0 . की चौड़ाई के सापेक्ष
4	रेम मूल तत्व के फ़ॉन्ट-आकार के सापेक्ष
5	vw व्यूपोर्ट की चौड़ाई के 1% के सापेक्ष*
6	वीएच व्यूपोर्ट की ऊंचाई के 1% के सापेक्ष*
7	vmin व्यूपोर्ट के 1% छोटे आयाम के सापेक्ष
8	vmax व्यूपोर्ट के 1% के सापेक्ष* बड़ा आयाम
9	% मूल तत्व के सापेक्ष

उदाहरण

आइए हम सापेक्ष लंबाई इकाइयों का उपयोग करके एक उदाहरण देखें -

<!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>

आउटपुट

CSS निरपेक्ष और सापेक्ष इकाइयों को समझना