एचटीएमएल <मेटा> टैग
उदाहरण
HTML दस्तावेज़ में मेटाडेटा का वर्णन करें:
<head>
<meta charset="UTF-8">
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML, CSS, JavaScript">
<meta name="author" content="John Doe">
<meta
name="viewport" content="width=device-width, initial-scale=1.0">
</head>
नीचे और अधिक "इसे स्वयं आज़माएं" उदाहरण।
परिभाषा और उपयोग
<meta>
टैग HTML दस्तावेज़ के बारे में मेटाडेटा को परिभाषित करता है । मेटाडेटा डेटा के बारे में डेटा (सूचना) है।
<meta>
टैग हमेशा <head> तत्व के अंदर जाते हैं, और आमतौर पर वर्ण सेट, पृष्ठ विवरण, कीवर्ड, दस्तावेज़ के लेखक और व्यूपोर्ट सेटिंग्स को निर्दिष्ट करने के लिए उपयोग किए जाते हैं।
मेटाडेटा को पृष्ठ पर प्रदर्शित नहीं किया जाएगा, लेकिन यह मशीन द्वारा विश्लेषण योग्य है।
मेटाडेटा का उपयोग ब्राउज़र (सामग्री या पृष्ठ पुनः लोड कैसे करें), खोज इंजन (कीवर्ड), और अन्य वेब सेवाओं द्वारा किया जाता है।
टैग के माध्यम से वेब डिज़ाइनरों को व्यूपोर्ट (वेब पेज के उपयोगकर्ता के दृश्य क्षेत्र) पर नियंत्रण करने की एक विधि है <meta>
(नीचे "व्यूपोर्ट सेट करना" उदाहरण देखें)।
ब्राउज़र समर्थन
Element | |||||
---|---|---|---|---|---|
<meta> | Yes | Yes | Yes | Yes | Yes |
गुण
Attribute | Value | Description |
---|---|---|
charset | character_set | Specifies the character encoding for the HTML document |
content | text | Specifies the value associated with the http-equiv or name attribute |
http-equiv | content-security-policy content-type default-style refresh |
Provides an HTTP header for the information/value of the content attribute |
name | application-name author description generator keywords viewport |
Specifies a name for the metadata |
वैश्विक गुण
<meta>
टैग HTML में वैश्विक विशेषताओं का भी समर्थन करता है ।
और ज्यादा उदाहरण
खोज इंजन के लिए कीवर्ड परिभाषित करें:
<meta name="keywords" content="HTML, CSS, JavaScript">
अपने वेब पेज के विवरण को परिभाषित करें:
<meta name="description" content="Free Web tutorials for
HTML and CSS">
किसी पृष्ठ के लेखक को परिभाषित करें:
<meta name="author" content="John Doe">
दस्तावेज़ को हर 30 सेकंड में ताज़ा करें:
<meta http-equiv="refresh" content="30">
अपनी वेबसाइट को सभी उपकरणों पर अच्छा दिखाने के लिए व्यूपोर्ट सेट करना:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
व्यूपोर्ट सेट करना
व्यूपोर्ट एक वेब पेज का उपयोगकर्ता का दृश्य क्षेत्र है। यह डिवाइस के साथ बदलता रहता है - यह कंप्यूटर स्क्रीन की तुलना में मोबाइल फोन पर छोटा होगा।
आपको अपने सभी वेब पेजों में निम्नलिखित <meta>
तत्व शामिल करने चाहिए:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
यह ब्राउज़र को पेज के आयामों और स्केलिंग को नियंत्रित करने के निर्देश देता है।
डिवाइस की width=device-width
स्क्रीन-चौड़ाई का पालन करने के लिए भाग पृष्ठ की चौड़ाई निर्धारित करता है (जो डिवाइस के आधार पर अलग-अलग होगा)।
initial-scale=1.0
जब पृष्ठ पहली बार ब्राउज़र द्वारा लोड किया जाता है तो यह भाग प्रारंभिक ज़ूम स्तर सेट करता है।
यहां व्यूपोर्ट मेटा टैग के बिना वेब पेज और व्यूपोर्ट मेटा टैग वाले उसी वेब पेज का एक उदाहरण दिया गया है :
युक्ति: यदि आप इस पृष्ठ को फ़ोन या टैबलेट से ब्राउज़ कर रहे हैं, तो आप अंतर देखने के लिए नीचे दिए गए दो लिंक पर क्लिक कर सकते हैं।
आप हमारे उत्तरदायी वेब डिज़ाइन - व्यूपोर्ट ट्यूटोरियल में व्यूपोर्ट के बारे में अधिक पढ़ सकते हैं ।
संबंधित पृष्ठ
एचटीएमएल ट्यूटोरियल: एचटीएमएल हेड
HTML DOM संदर्भ: मेटा ऑब्जेक्ट
डिफ़ॉल्ट सीएसएस सेटिंग्स
कोई नहीं।