HTML में तत्व का प्रकार कैसे सेट करें?

type एट्रिब्यूट

type एट्रिब्यूट HTML में विभिन्न तत्वों का प्रकार निर्दिष्ट करने के लिए उपयोग किया जाता है। यह सबसे अधिक <input>, <button>, <script>, <style>, <link>, <menu>, <embed>, <object>, <source>, <ol>, <ul> तत्वों के साथ उपयोग किया जाता है।

<input> प्रकार (सबसे आम उपयोग)

थ>प्रकार थ>विवरण थ>उदाहरण

`text`	एकल-लाइन टेक्स्ट इनपुट	`<input type="text" name="name">`
`password`	मास्क किया गया पासवर्ड इनपुट	`<input type="password" name="pwd">`
`email`	ईमेल सत्यापन के साथ	`<input type="email" name="email">`
`number`	संख्यात्मक इनपुट (स्पिनर के साथ)	`<input type="number" min="0" max="100">`
`tel`	टेलीफोन नंबर	`<input type="tel" name="phone">`
`url`	URL सत्यापन के साथ	`<input type="url" name="website">`
`date`	दिनांक चुनने वाला	`<input type="date" name="dob">`
`datetime-local`	दिनांक और समय (टाइमज़ोन के बिना)	`<input type="datetime-local">`
`checkbox`	चेकबॉक्स	`<input type="checkbox" name="agree">`
`radio`	रेडियो बटन (समूह में एक चुनें)	`<input type="radio" name="gender" value="m">`
`file`	फ़ाइल अपलोड	`<input type="file" name="avatar" accept="image/*">`
`submit`	फॉर्म सबमिट बटन	`<input type="submit" value="भेजें">`
`button`	क्लिक करने योग्य बटन (कोई डिफ़ॉल्ट व्यवहार नहीं)	`<input type="button" value="क्लिक" onclick="...">`
`hidden`	अदृश्य फील्ड	`<input type="hidden" name="token" value="xyz">`
`range`	स्लाइडर नियंत्रण	`<input type="range" min="0" max="100">`
`color`	रंग चुनने वाला	`<input type="color" name="theme">`
`search`	खोज फील्ड (क्लियर बटन के साथ)	`<input type="search" name="q">`

उदाहरण: फॉर्म विभिन्न इनपुट प्रकारों के साथ

<!DOCTYPE html>
<html>
<head>
    <title>HTML इनपुट प्रकार उदाहरण</title>
</head>
<body>
    <h2>छात्र विवरण फॉर्म</h2>
    <form>
        <p>
            <label>नाम: <input type="text" name="name" required></label>
        </p>
        <p>
            <label>विषय: <input type="text" name="subject"></label>
        </p>
        <p>
            <label>रैंक: <input type="number" name="rank" min="1"></label>
        </p>
        <p>
            <label>ईमेल: <input type="email" name="email"></label>
        </p>
        <p>
            <label>जन्म तिथि: <input type="date" name="dob"></label>
        </p>
        <p>
            <label>प्रोफाइल फोटो: <input type="file" name="photo" accept="image/*"></label>
        </p>
        <p>
            <input type="submit" value="पंजीकरण करें">
            <input type="reset" value="रीसेट">
        </p>
    </form>
</body>
</html>

अन्य तत्वों पर type एट्रिब्यूट

तत्व	type मान	उद्देश्य
`<button>`	submit, reset, button	बटन व्यवहार (डिफ़ॉल्ट: submit)
`<script>`	text/javascript, module, importmap	स्क्रिप्ट भाषा/मॉड्यूल प्रकार
`<style>`	text/css	स्टाइलशीट भाषा
`<link>`	text/css, application/json, etc.	लिंक किए गए संसाधन का MIME प्रकार
`<ol>`	1, A, a, I, i	क्रमांकन शैली (CSS list-style-type पसंद करें)
`<source>`	video/mp4, audio/mpeg, image/webp	मीडिया MIME प्रकार

नोट

<input> के लिए अज्ञात type मान text पर डिफ़ॉल्ट हो जाते हैं, जिससे नए HTML5 इनपुट प्रकार पुराने ब्राउज़र्स में भी काम करते हैं (ग्रेसफुल डिग्रेडेशन)।