HTML <link> का उपयोग करना सीखें तत्व।
एचटीएमएल <link> तत्व का उपयोग मुख्य रूप से बाहरी सीएसएस फ़ाइलों को आयात करने के लिए किया जाता है जो आपकी वेबसाइट में शैलियों को जोड़ते हैं।
<link> तत्व <head> . के अंदर रहता है तत्व, और कई प्रकार की विशेषताओं को स्वीकार करता है:
<!DOCTYPE html>
<html>
<head>
<title>Document title</title>
<link href="/styles/main.css" rel="stylesheet" />
</head>
<body></body>
</html>
सबसे आम <link> तत्व विशेषताएँ वे दो हैं जिन्हें आप ऊपर देखते हैं, href और rel :
hrefआपकी लिंक की गई फ़ाइल का स्थान निर्दिष्ट करता है, इस मामले में एक स्टाइल शीट जिसेmain.css. कहा जाता हैrelसंबंध के लिए खड़ा है, और यह अंदर बैठे दस्तावेज़ और लिंक की गई CSS फ़ाइल के बीच संबंध को निर्दिष्ट करता है।
अपनी वेबसाइट को स्टाइल करने का एक वैकल्पिक तरीका <style> . का उपयोग करना है तत्व, जो आपको सीधे अपने दस्तावेज़ के अंदर सीएसएस शैलियों को एम्बेड करने की अनुमति देता है (जिसे इनलाइन सीएसएस . भी कहा जाता है) )।
हालांकि, वेबसाइटों को स्टाइल करने का आधुनिक तरीका <link> . का उपयोग करना है शैलियों को आयात करने के लिए, या तो अपने स्वयं के प्रोजेक्ट फ़ोल्डर से your-project/styles/main.css , या किसी बाहरी प्रदाता से (दूसरे डोमेन पर)।
जानना अच्छा है:
अगर आप <style> . दोनों का इस्तेमाल करते हैं और <link> एक ही दस्तावेज़ में शैली के लिए तत्व, गलती से शैलियों को ओवरराइड करना आसान है।
उदाहरण के लिए, निम्न उदाहरण देखें, जो दोनों स्टाइलिंग दृष्टिकोणों का उपयोग करता है:
<!DOCTYPE html>
<html>
<head>
<!-- Embedded (internal) styles -->
<style>
h1 {
color: red;
}
p {
color: green;
}
</style>
<!-- Import external style sheet -->
<link href="/styles/main.css" rel="stylesheet" />
</head>
<body>
<h1>This is a red heading</h1>
<p>This is a green paragraph</p>
</body>
</html>
तो उदाहरण के लिए यदि बाहरी स्टाइलशीट h1 . पर एक रंग गुण मान को परिभाषित करता है और p चयनकर्ता, उदा. इसे blue देकर रंग मान, फिर red और green ओवरराइट किया जाएगा, क्योंकि <link> तत्व <style> . के बाद आता है उपरोक्त मार्कअप उदाहरण में तत्व।
इसे मिलाना इतना आसान है, इसलिए मेरी सलाह है कि आप आमतौर पर <link> का उपयोग करते रहें। शैलियों को आयात करने के लिए तत्व — और केवल <style> . का उपयोग करें अत्यधिक विशिष्ट उपयोग के मामलों के लिए तत्व।