एचटीएमएल एसेंशियल चीट शीट: टैग्स, एट्रीब्यूट्स, और बहुत कुछ

वेबपेज बनाना HTML से शुरू होता है। उन्हें सुशोभित करना और उन्हें इंटरैक्टिव बनाना बाद में आता है। लेकिन कार्यात्मक स्थिर वेबसाइट बनाना शुरू करने के लिए, आपको HTML की समझ की आवश्यकता है। (इस मार्कअप भाषा का त्वरित परिचय चाहते हैं? हमारा पढ़ें एचटीएमएल अक्सर पूछे जाने वाले प्रश्न.)

भाषा सीखने के भाग के रूप में, आपको अपनी HTML शब्दावली में जोड़ने के लिए आवश्यक तत्वों की एक लंबी सूची है। और यह कार्य पहली बार में कठिन लग सकता है, यही वजह है कि हम निम्नलिखित चीट शीट लेकर आए हैं। यह आपको जरूरत पड़ने पर किसी भी समय HTML तत्वों को खोजने/समझने/याद करने का एक आसान तरीका देता है।

चीट शीट में वेबपेजों को संरचित करने, टेक्स्ट को फ़ॉर्मेट करने, फ़ॉर्म, चित्र, सूचियाँ, लिंक और टेबल जोड़ने के लिए टैग और विशेषताएँ शामिल हैं। इसमें HTML5 में पेश किए गए टैग और आमतौर पर उपयोग किए जाने वाले विशेष वर्णों के लिए HTML कोड भी शामिल हैं।

मुफ्त डाउनलोड: यह चीट शीट a. के रूप में उपलब्ध है डाउनलोड करने योग्य पीडीएफ हमारे वितरण भागीदार, ट्रेडपब से। इसे पहली बार एक्सेस करने के लिए आपको एक छोटा फॉर्म भरना होगा। डाउनलोड HTML एसेंशियल चीट शीट.

HTML एसेंशियल चीट शीट

... ... ... ... ...

...

छोटा रास्ता	कार्य
मूल टैग
...	HTML डॉक्यूमेंट का पहला और आखिरी टैग। अन्य सभी टैग इन ओपनिंग और क्लोजिंग टैग के बीच स्थित हैं।
...	दस्तावेज़ के लिए मेटाडेटा का संग्रह निर्दिष्ट करता है।
	पृष्ठ के शीर्षक का वर्णन करता है और ब्राउज़र के शीर्षक बार में दिखाई देता है।
...	वेबपेज पर प्रदर्शित होने वाली सभी सामग्री शामिल है।
दस्तावेज़ जानकारी
दस्तावेज़ के आधार URL और सभी संबंधित लिंक का उल्लेख करता है।
पृष्ठ के बारे में अतिरिक्त जानकारी के लिए जैसे लेखक, प्रकाशन तिथि, आदि।
स्टाइल शीट जैसे बाहरी तत्वों के लिंक।
	सीएसएस (कैस्केडिंग स्टाइल शीट्स) जैसी दस्तावेज़ शैली की जानकारी शामिल है।
	बाहरी स्क्रिप्ट के लिंक शामिल हैं।
पाठ स्वरूपण
... या ...	टेक्स्ट को बोल्ड बनाता है।
...	टेक्स्ट को इटैलिक करता है और उसे बोल्ड बनाता है।
...	टेक्स्ट को इटैलिक करता है लेकिन बोल्ड नहीं करता है।
...	स्ट्राइकथ्रू पाठ।
...	एक उद्धरण के लेखक का हवाला देते हैं।
...	टेक्स्ट के हटाए गए हिस्से को लेबल करता है।
...	सामग्री में डाला गया एक अनुभाग दिखाता है।
...	उद्धरण प्रदर्शित करने के लिए। अक्सर के साथ प्रयोग किया जाता है उपनाम।
...	छोटे उद्धरणों के लिए।
...	संक्षिप्त और पूर्ण रूपों के लिए।
...	संपर्क विवरण निर्दिष्ट करता है।
...	परिभाषाओं के लिए।
...	कोड स्निपेट के लिए।
...	सबस्क्रिप्ट लिखने के लिए
...	सुपरस्क्रिप्ट लिखने के लिए।
...	HTML5 में टेक्स्ट के आकार को कम करने और अनावश्यक जानकारी को चिह्नित करने के लिए।
दस्तावेज़ संरचना
...	शीर्षकों के विभिन्न स्तर। H1 सबसे बड़ा है और H6 सबसे छोटा है।
...	सामग्री को ब्लॉक में विभाजित करने के लिए।
...	पृष्ठ के स्वरूपण को बर्बाद किए बिना छवि, आइकन, इमोटिकॉन जैसे इनलाइन तत्व शामिल हैं।
...	सादा पाठ शामिल है।
	एक नई लाइन बनाता है।
	अनुभाग का अंत दिखाने के लिए एक क्षैतिज पट्टी खींचता है।
सूचियों
...	वस्तुओं की आदेशित सूची के लिए।
...	वस्तुओं की अनियंत्रित सूची के लिए।
...	एक सूची में अलग-अलग मदों के लिए।
...	परिभाषाओं के साथ वस्तुओं की सूची।
...	शरीर सामग्री के साथ इनलाइन एकल शब्द की परिभाषा।
...	परिभाषित अवधि के लिए विवरण।
लिंक
...	हाइपरलिंक के लिए एंकर टैग।
...	ईमेल पते से जोड़ने के लिए टैग।
...	संपर्क नंबर सूचीबद्ध करने के लिए एंकर टैग।
...	उसी पृष्ठ के दूसरे भाग से लिंक करने के लिए एंकर टैग।
...	वेबपेज के एक डिव सेक्शन में नेविगेट करता है। (उपरोक्त टैग की विविधता)
इमेजिस
	छवि फ़ाइलों को प्रदर्शित करने के लिए।
के लिए गुण उपनाम
स्रोत = "यूआरएल"	छवि के स्रोत पथ से लिंक करें।
ऑल्ट = "पाठ"	जब माउस को छवि पर मँडराया जाता है तो पाठ प्रदर्शित होता है।
ऊंचाई = ""	पिक्सेल या प्रतिशत में छवि की ऊंचाई।
चौड़ाई = ""	पिक्सेल या प्रतिशत में छवि की चौड़ाई।
संरेखित करें = ""	पृष्ठ पर छवि के सापेक्ष संरेखण।
सीमा = ""	छवि की सीमा मोटाई।
	क्लिक करने योग्य मानचित्र से लिंक करें।
	मानचित्र छवि का नाम।
छवि मानचित्र का छवि क्षेत्र।
के लिए गुण उपनाम
आकार = ""	छवि क्षेत्र का आकार।
कोर्ड्स = ""	मानचित्र छवि क्षेत्र के निर्देशांक।
फार्म
...	HTML फॉर्म के लिए पैरेंट टैग।
के लिए गुण उपनाम
क्रिया = "यूआरएल"	यूआरएल जहां फॉर्म डेटा सबमिट किया गया है।
विधि = ""	फॉर्म सबमिशन प्रोटोकॉल (POST या GET) निर्दिष्ट करता है।
एनक्टाइप = ""	POST सबमिशन के लिए डेटा एन्कोडिंग योजना।
स्वत: पूर्ण	निर्दिष्ट करता है कि फ़ॉर्म स्वतः पूर्ण है या नहीं।
नोवालिडेट	निर्दिष्ट करता है कि फॉर्म जमा करने से पहले मान्य किया जाना चाहिए या नहीं।
स्वीकार-वर्णमाला	प्रपत्र सबमिशन के लिए वर्ण एन्कोडिंग निर्दिष्ट करता है।
लक्ष्य	दिखाता है कि फ़ॉर्म सबमिशन प्रतिक्रिया कहाँ प्रदर्शित होगी।
...	प्रपत्र में समूह संबंधित तत्व/
...	निर्दिष्ट करता है कि उपयोगकर्ता को प्रत्येक प्रपत्र फ़ील्ड में क्या दर्ज करना चाहिए।
...	फ़ील्डसेट तत्व के लिए एक कैप्शन।
निर्दिष्ट करता है कि उपयोगकर्ता से किस प्रकार का इनपुट लेना है।
के लिए गुण उपनाम
टाइप = ""	इनपुट के प्रकार (पाठ, दिनांक, पासवर्ड) को निर्धारित करता है।
नाम = ""	इनपुट फ़ील्ड का नाम निर्दिष्ट करता है।
मूल्य = ""	इनपुट फ़ील्ड में मान निर्दिष्ट करता है।
आकार = ""	इनपुट फ़ील्ड के लिए वर्णों की संख्या सेट करता है।
अधिकतम लम्बाई = ""	अनुमत इनपुट वर्णों की सीमा निर्धारित करता है।
आवश्यक	एक इनपुट फ़ील्ड अनिवार्य बनाता है।
चौड़ाई = ""	पिक्सेल में इनपुट फ़ील्ड की चौड़ाई सेट करता है।
ऊंचाई = ""	पिक्सेल में इनपुट फ़ील्ड की ऊँचाई सेट करता है।
प्लेसहोल्डर = ""	अपेक्षित फ़ील्ड मान का वर्णन करता है।
पैटर्न = ""	एक रेगुलर एक्सप्रेशन निर्दिष्ट करता है, जिसका उपयोग उपयोगकर्ता के टेक्स्ट में पैटर्न देखने के लिए किया जा सकता है।
मिनट = ""	इनपुट तत्व के लिए अनुमत न्यूनतम मान।
अधिकतम = ""	किसी इनपुट तत्व के लिए अनुमत अधिकतम मान।
विकलांग	इनपुट तत्व को अक्षम करता है।
...	उपयोगकर्ता से डेटा की लंबी स्ट्रिंग कैप्चर करने के लिए।
...	उन विकल्पों की सूची निर्दिष्ट करता है जिन्हें उपयोगकर्ता चुन सकता है।
के लिए गुण उपनाम
नाम = ""	ड्रॉपडाउन सूची के लिए नाम निर्दिष्ट करता है।
आकार = ""	उपयोगकर्ता को दिए गए विकल्पों की संख्या।
विभिन्न	सेट करता है कि उपयोगकर्ता सूची से कई विकल्प चुन सकता है या नहीं।
आवश्यक	निर्दिष्ट करता है कि फॉर्म जमा करने के लिए कोई विकल्प चुनना आवश्यक है या नहीं।
ऑटोफोकस	निर्दिष्ट करता है कि एक पृष्ठ लोड होने के बाद ड्रॉप-डाउन सूची स्वचालित रूप से फोकस में आती है।
...	ड्रॉपडाउन सूची में आइटम को परिभाषित करता है।
मूल्य = ""	किसी दिए गए विकल्प के लिए टेक्स्ट प्रदर्शित करता है।
गिने चुने	प्रदर्शित होने वाला डिफ़ॉल्ट विकल्प सेट करता है।
...	फॉर्म जमा करने के लिए एक बटन बनाने के लिए टैग करें।
ऑब्जेक्ट्स और आईफ्रेम्स
	एम्बेडेड फ़ाइल प्रकार का वर्णन करता है।
के लिए गुण
ऊंचाई = ""	वस्तु की ऊँचाई।
चौड़ाई = ""	वस्तु की चौड़ाई।
टाइप = ""	वस्तु में मीडिया का प्रकार है।
	बाहरी जानकारी को एम्बेड करने के लिए एक इनलाइन फ्रेम।
नाम = ""	आईफ्रेम का नाम।
स्रोत = ""	फ़्रेम के अंदर सामग्री के लिए स्रोत URL।
srcdoc = ""	फ्रेम के भीतर HTML सामग्री।
ऊंचाई = ""	आईफ्रेम की ऊंचाई।
चौड़ाई = ""	आईफ्रेम की चौड़ाई।
आईफ्रेम को अनुकूलित करने के लिए अतिरिक्त पैरामीटर जोड़ता है।
...	बाहरी एप्लिकेशन या प्लगइन एम्बेड करता है।
के लिए गुण
ऊंचाई = ""	एम्बेड की ऊंचाई सेट करता है।
चौड़ाई = ""	एम्बेड की चौड़ाई सेट करता है।
टाइप = ""	एम्बेड का प्रकार या प्रारूप।
स्रोत = ""	एम्बेडेड फ़ाइल का स्रोत पथ।
टेबल
...	तालिका के लिए सभी सामग्री को परिभाषित करता है।
तालिका का विवरण।
तालिका में प्रत्येक स्तंभ के लिए शीर्षलेख।
तालिका के लिए बॉडी डेटा को परिभाषित करता है।
तालिका के पाद लेख की सामग्री का वर्णन करता है।
एक पंक्ति के लिए सामग्री।
	...	एक हेडर आइटम में डेटा।
	...	एकल तालिका कक्ष में सामग्री।
स्वरूपण के लिए समूह कॉलम।
सूचना का एक एकल स्तंभ।
HTML5 नए टैग
...	वेबपेज हेडर निर्दिष्ट करता है।
	वेबपेज पाद लेख निर्दिष्ट करता है।
...	वेबपेज की मुख्य सामग्री को चिह्नित करता है।
...	एक लेख निर्दिष्ट करता है।
	किसी पृष्ठ की साइडबार सामग्री निर्दिष्ट करता है।
...	वेबपेज में एक विशेष खंड निर्दिष्ट करता है।
...	अतिरिक्त जानकारी का वर्णन करने के लिए।
...	उपरोक्त टैग के लिए शीर्षक के रूप में उपयोग किया जाता है। उपयोगकर्ता को हमेशा दिखाई देता है.
...	एक डायलॉग बॉक्स बनाता है।
...	चार्ट और आंकड़े शामिल करने के लिए उपयोग किया जाता है।
	एक का वर्णन करता है तत्व।
...	पाठ के एक विशिष्ट भाग को हाइलाइट करता है।
	वेबपेज पर नेविगेशन लिंक का सेट।
...	किसी सूची या मेनू से कोई विशेष आइटम।
...	किसी दी गई सीमा के भीतर डेटा को मापता है।
...	एक प्रगति पट्टी रखता है और प्रगति को ट्रैक करता है।
...	वह पाठ प्रदर्शित करता है जो रूबी एनोटेशन का समर्थन नहीं करता है।
...	पूर्वी एशिया टाइपोग्राफी चरित्र विवरण प्रदर्शित करता है।
...	पूर्वी एशियाई टाइपोग्राफी के लिए रूबी एनोटेशन।
...	समय और तारीख की पहचान करता है।
सामग्री के भीतर एक लाइन ब्रेक।
HTML5 चरित्र वस्तुएँ
" या "	उद्धरण चिह्न
<	संकेत से कम (
> या &जीटी;	चिह्न से बड़ा (>)
या	मानक या स्थायी जगह
© ओआर &प्रतिलिपि;	स्वताधिकारी चिन्ह
™ या û	ट्रेडमार्क प्रतीक
@ या &उमल;	"पर" प्रतीक (@)
& या &	एम्परसेंड प्रतीक (&)
• या ö	छोटी गोली
HTML वर्ण टाइप करते समय अर्धविराम से पहले स्थान पर ध्यान न दें।

व्यावहारिक अनुभव के लिए एक वेबसाइट बनाएं

एक बार समझ गए HTML कोड की मूल बातें और सीएसएस और जावास्क्रिप्ट का कार्यसाधक ज्ञान हो, वेबसाइट बनाने में अपना हाथ आजमाएं वेबसाइट कैसे बनाएं: शुरुआती के लिएआज मैं आपको शुरुआत से एक पूरी वेबसाइट बनाने की प्रक्रिया के बारे में बताऊंगा। अगर यह मुश्किल लगता है तो चिंता न करें। मैं इसके माध्यम से हर कदम पर आपका मार्गदर्शन करूंगा। अधिक पढ़ें . साथ ही, हमारे को सहेजना सुनिश्चित करें CSS3 के गुण शीट को धोखा देते हैं आवश्यक CSS3 गुण पत्रक धोखाहमारे CSS3 गुण चीट शीट के साथ मास्टर आवश्यक CSS सिंटैक्स। अधिक पढ़ें तथा जावास्क्रिप्ट चीट शीट अल्टीमेट जावास्क्रिप्ट चीट शीटइस चीट शीट के साथ जावास्क्रिप्ट तत्वों पर एक त्वरित पुनश्चर्या प्राप्त करें। अधिक पढ़ें भविष्य के उपयोग के लिए!