<पी> <hr> टैग का उपयोग वेब पेज पर क्षैतिज रेखाएं खींचने के लिए किया जाता है। यह टैग विभिन्न अनुभागों के बीच एक क्षैतिज रेखा खींचकर सामग्री को अलग करने के लिए सबसे उपयोगी HTML टैग में से एक है। इस गाइड में, हम सीखेंगे कि <hr> की मोटाई कैसे बदलें विभिन्न तरीकों से CSS का उपयोग करके टैग करें। सिंटेक्स
hr {
height: value;
border: value;
}
HTML में घंटा टैग
<पी> <hr> टैग क्षैतिज नियम के लिए है। यह एक स्व-समापन टैग है जो एक क्षैतिज रेखा का उपयोग करके वेब पेज के अनुभागों के बीच एक दृश्य विभाजक बनाता है। उदाहरण
<!DOCTYPE html>
<html>
<head>
<style>
hr {
margin: 20px 0;
}
</style>
</head>
<body>
<p>Section 1</p>
<hr>
<p>Section 2</p>
</body>
</html>
Two text sections separated by a thin horizontal line with proper spacing.
विधि 1:ऊँचाई गुण का उपयोग करना
<पी> इस पद्धति में, हम सीधे height का उपयोग करते हैं <hr> की मोटाई बदलने के लिए सीएसएस की संपत्ति टैग. यह विधि नियंत्रित करती है कि क्षैतिज रेखा कितनी मोटी दिखाई देती है उदाहरण
<!DOCTYPE html>
<html>
<head>
<style>
hr {
height: 5px;
background-color: black;
border: none;
margin: 20px 0;
}
</style>
</head>
<body>
<p>Above the line</p>
<hr>
<p>Below the line</p>
</body>
</html>
Two text sections separated by a thick 5px black horizontal line.
विधि 2:सीमा संपत्ति का उपयोग करना
<पी> इस विधि में, हम border-top का उपयोग करते हैं या border-bottom मोटी क्षैतिज रेखा बनाने के लिए सीएसएस की संपत्ति। यह विधि अधिक लचीली है और धराशायी या बिंदीदार रेखाओं जैसे विभिन्न डिज़ाइनों का समर्थन करती है उदाहरण
<!DOCTYPE html>
<html>
<head>
<style>
hr {
border: none;
border-top: 6px solid blue;
margin: 20px 0;
}
</style>
</head>
<body>
<p>Above the Line</p>
<hr>
<p>Below the Line</p>
</body>
</html>
Two text sections separated by a thick 6px blue horizontal line.
तुलना
विधि | फायदा | सर्वोत्तम उपयोग का मामला | ऊँचाई संपत्ति सरल और सीधी ठोस रंगीन रेखाएँ सीमा संपत्ति अधिक अनुकूलन योग्य शैलियाँ धराशायी, बिंदीदार या स्टाइल वाली रेखाएँ निष्कर्ष
<पी> आप <hr> की मोटाई आसानी से बदल सकते हैं सीएसएस का उपयोग कर टैग करें। height ठोस रेखाओं के लिए विधि सीधी है, जबकि border विधि अधिक स्टाइलिंग लचीलापन प्रदान करती है। अपनी डिज़ाइन आवश्यकताओं के आधार पर चुनें। <पी>