Top HTML Interview Questions and Answers in Hindi for Freshers

by

HTML Interview Questions and Answers आर्टिकल में html से जुड़े उन सवालों को जानेगे जो interview में ज्यादा तर पूछे जाते हैं और उसके जवाब समझेंगे |

Table of Contents hide
1 HTML Interview Questions and Answers in Hindi
2 अन्य सुझाव

HTML Interview Questions and Answers in Hindi

Q.1) html क्या है ?

answer : HTML  पूरा नाम  Hyper Text MarkUp Language है | ये एक Mark Up Language है | WebSite, WebPage बनाने के लिए HTML का इस्तेमाल होता है | कोई भी WebSite बनाने के लिए सबसे पहली जरुरत HTML की होती है | HTML,  किसी भी WebPage की बुनियादी structure बनाने के लिए जरुरी है |

Q.2) HTML में Tags और Elements में क्या अंतर है?

answer : html document कई सारे tags के समारोह से बनती है | html में जो भी लिखी जाती है उसे tag के अंदर लिखी जाती है | tag को < और > सिंबल के अंदर लिखी जाती है |

tag और उसके अंदर की content को मिलाकर html element बनती है |

HTML Tag + Content = HTML Element
Example: <h1>Welcome</h1>

ऊपर के उदहारण में <h1> एक tag है, और Welcome उस टैग के अंदर लिखा हुआ content | इसीलिए <h1>Welcome</h1> एक element बना|

Q.3) HTML में attribute क्या होता है ?

answer : Attributes, html elements के बारे में अतिरिक्त जानकारी देने के लिए इस्तेमाल होता है | हर html element के लिए कोई ना कोई attribute रहती ही है | और इसे html के start tag के अंदर लिखा जाता है या फिर self closing tag के अंदर लिखी जाती है |

attribute को name/value pair से दरसाया जाता है | attribute value को single quotes या double quotes के अंदर लिखी जाती है |

syntax : 
<tag attributename=”attribute value” >content</tag>
<tag attributename=”attribute value” />

उदाहरण:
<p id=”parg1″>First Paragraph id </p>
<img id=”img1″ src=”flower.jpg” />

ऊपर के उदाहरण में देखिये id attribute से <p> और <img> tag को एक unique identity दी गयी है | और src attribute के जरिये <img> tag में कोनसी image दिखेगी वो बताया गया है |

Q.4) Id attribute का क्या उपयोग है ?

Answer: किसी html tag को unique reference देने के लिए Id attribute का उपयोग होता है | Id attribute की value हमेसा unique होनी चाहिए |

Q.5) inline element और block level element में क्या अंतर है ?

  • inline element एक नयी line से सुरु नहीं होती | वो उतना ही जगह लेती है जितना इसका content होता है |
  • inline element के साथ अन्य element को लिखा जा सकता है | मतलब inline tag के बगल में अन्य tags भी रह सकतें हैं |
  • <span>, <b>, <strong>, <a>, <input> tags सब inline tag के उदाहरण हैं |
  • inline element की dimension को css property के जरिये manage नहीं किया जा सकता है यानि इसकी width और height को css के जरिये बदली नहीं जा सकती है |
  • block tag वो है जो हमेसा एक नयी line से सुरु होती है |और ये उस line की पूरी width ले लेती है |
  • block tag के बगल में कोई और tag को रखी नहीं जा सकती है|
  • <div>, <img>, <section>, <form>, <nav>, <header>, <ol>, <address>, <hr> tags आदि block tags हैं |
  • block level element की dimension को css property के जरिये manage किया जा सकता है यानि इसकी width और height को css के जरिये बदली जा सकती है |

Q.6) html में hyperlink क्या है और कैसे बनायीं जाती है ?

answer : html में एक पेज को दुसरे पेज से link करने के लिए hyperlink का इस्तेमाल होता है | anchor tag जिसे <a> के जरिये लिखी जाती है उसे hyperlink बनाने के लिए इस्तेमाल की जाती है |

href attribute <a> tag की जरुरी attribute है जिसके अंदर अन्य वेबपेज या वेबसाइट की link डाली जाती है |

syntax: <a href=”…”> link text </a>

उदाहरण: <a href=”home.html”>Home</a>

Q.7) क्या hyperlink सिर्फ text के ऊपर लगायी जा सकती है?

answer: जवाब है नहीं | hyperlink text और image दोनों में लगाये जा सकतें हैं |

Q.8) HTML Comment क्या है और इसका इस्तेमाल क्यों होता है ?

answer : html comment tag का इस्तेमाल कुछ comment देने के लिए होता है | इससे हम document बना सकते हैं | यानि कोनसा कोड क्यों लिखा गया है वो information, comment में लिखा जाता है | जिससे कोड का इस्तेमाल समझना आसान हो जाता है | comment को browser read नहीं करता | इसलिए comment browser में दिखाई नहीं देती |

Comment tag को <!– सिंबल सुरु करते हैं, और –>सिंबल से अंत किया जाता है |

उदाहरण: <!-- this is a comment line -->

Q.9) html में list क्या है और कितने तरह की होती है ?

answer : जब कोई जानकारी को लिस्ट के हिसाब से सजाना होता है तो ऐसे चीजों को html page में <list> tag के जरिये लिखा जाता है |

HTML List तीन तरह के होतें हैं : 1) Ordered List, 2) UnOrdered List, 3) Description List

  1. Ordered List — Ordered List में सारे लिस्ट items एक क्रम से सजे होते हैं | या तो उन्हें नंबर से या alphabet के क्रम से सजाया जाता है | <ol> tag से ordered list सुरु होता है और इसके सारे items को <li> tag से लिखा जाता है |
उदाहरण:
<ol>
 <li>mina</li>
 <li>ritu</li>
</ol>

result:

  1. mina
  2. ritu

2. UnOrdered List — Unordered List को Bullet List भी कहा जाता है और इसमें सारे लिस्ट item को बुलेट से सजाया जाता है | Unordered List <ul> tag से सुरु होता है, और इसके सारे element <li> tag से सजाये जाते हैं |

उदाहरण
<ul>
 <li>mina</li>
 <li>ritu</li>
</ul>

result

  • mina
  • ritu

3. description list — description list से एक ऐसी लिस्ट बनायी जाती है जिसमे item के नाम के साथ उसकी description भी बताई जाती है | description list को <dl> tag से दर्शाया जाता है | लिस्ट आइटम को <dt> tag से बताया जाता है और उसकी description को <dd>tag से दर्शाया जाता है |

उदाहरण:

<dl>
 <dt>HTML</dt>
 <dd>HTML is a HYPERTEXT MARKUP LANGUAGE use to create basic structure of webpage<dd>
 <dt>CSS</dt> 
 <dd>CSS is Cascading StyleSheet used to give style to a webpage<dd>
</dl>

result

Q.10) html entities क्या होता है और क्यों इस्तेमाल किया जाता है ?

answer : html entities के जरिये reserved keywords को html कोड में लिखने के लिए इस्तेमाल होता है | कुछ special character जो keyboard में नहीं होते पर उसकी जरुरत होती है जैसे की copywrite symbol या फिर कुछ extra space लगाना हो | ये सब काम html code में सीधे तरीके से नहीं किया जा सकता है |

इसीलिए html entities का इस्तेमाल होता है | HTML Entities में हर special character को एक नाम और नंबर से दर्शाया गया है | कोई special character इस्तेमाल करना है तो उसकी नाम या नंबर का इस्तेमाल कर सकते हैं |

उदाहरण
< (less than angle bracket) का entitityname &lt; और entitynumber है &#60;

Q.11) html में nested webpage कैसे बनाएं ?

answer : एक वेबपेज के अंदर कोई दूसरी वेबपेज को दिखाने को nested webpage कहा जाता है | html में nested webpage <iframe> tag के जरिये बनायी जाती है |

<iframe> tag syntax:
<iframe title=”iframe title” src=”url” />

उदाहरण:
<iframe src=”iframe1.html” title=”smiley image” / >

Q.12) <span> tag और <div> tag में अंतर क्या है ?

<div> tag

  • <div> tag एक block level element है | ये हमेसा एक नयी line से सूरी होती है और browser की पूरी width लेती है |
  • अगर किसी section को highlight करके दिखाना है तो <div> की जरुरत पड़ती है |
  • <div> tag , align feature को support करती है |
  • ये हमेसा एक नयी line से सुरु होती है इसीलिए इसके बगल में कोई और element लिखी नहीं जा सकती |

<span> tag

  • <span> tag एक inline element है | ये अपनी content के हिसाब से जगह लेती है | इसे नयी line से सुरु होने की जरुरत नहीं पड़ती |
  • किसी शब्द या छोटे लाइन को highlight करके के दिखाना हो तो <span> tag का इस्तेमाल किआ जाता है |
  • <span> tag , align feature को support नहीं करती |
  • ये दुसरे element के साथ एक ही line में लिखी जा सकती है |

Q.13) <span> tag का क्या उपयोग है ?

answer : <span> tag एक inline element है | इसे निन्म कामो में इस्तेमाल किया जाता है

  • किसी text को color देना हो |
  • किसी text में background लगाना हो|
  • या फिर किसी line में कुछ text को highlight करना हो |

उदाहरण

<html>
 <head>

  <title>span tag example</title>
 </head>
 <body>
  <div>
   <p>fill the form with <span style="font-weight:bold">capital letter</span></p>
   <p>all <span style="color:red">*fields</span> are mandatory</p>
  </div>
 </body>
</html>

आउटपुट

span tag example

Q.14) html में doctype का क्या महत्व है ? क्या doctype कोई html tag है ?

answer : html code लिखने से पेहले doctype लिखी जाती है | doctype कोई html tag नहीं है | इसे इसलिए लिखी जाती है ताकि ये browser को html की version बता सके |

Q.15) alt attribute क्या है और image tag में क्यों लिखी जाती है ?

answer : alt, image tag की एक attribute है | ये image के बारे में browser को बताता है की कोनसे नाम की image है | इसे image की कोई alternate नाम देने के लिए इस्तेमाल किया जाता है |

जब किसी वजह से या internet slow होने की वजह से browser में वेबपेज load हो जाती है, पर image load नहीं हो पाती | तब image की जगह alt attribute में लिखी नाम दिखाई देती है जो user को बताती है की किस type का image है | तो इससे user को खाली जगह देख कर confuse नहीं होता वो जान पाता है की उस जगह कोई image है जिसका नाम दिखाई दे रहा है |

Q.16) html में maquee tag क्या होता है ?

answer : html webpage में कुछ text या images को scroll करके दिखाने के लिए marquee tag का इस्तेमाल होता है | जैसे कोई न्यूज़ वेबसाइट में कुछ खास न्यूज़ हमेसा scroll होके दीखता रहता है | वैसे ही वेबसाइट में कुछ खास image या text को हमेसा दिखाना है तो <marquee> tag काम में आता है |

direction attribute के मदद से text या images को vertically या horizontally scroll करना है वो बताया जाता है |

उदाहरण: <marquee direction=”left”>this is a text to scroll from right to left</marquee>

Q.17) HTML Semantic Elements क्या है ?

answer : semantic ऐसे शब्द को दर्शाता है जिसे देखते ही उसका उपयोग समझ आ जाता हो | semantic elements वो है जिसका उपयोग नाम से पता चलता है | <div> tag एक container tag है पर इसके अंदर किस section का कोड लिखा गया है वो पता नहीं चलता है |

इसीलिए html5 में कुछ ऐसे tags हैं जो developer को मदद करता है कोड को समझने के लिए | <header>, <footer>, <aside>, <nav>, <figure> आदि semantic elements है |

semantic elements developer और search engine दोनो को मदद करता है code को सही से समझने में की कोनसा section किस लिए लिखा गया है |

Q.18) html5 में क्या नया features हैं ?

answer : html5 , html का advanced version है | इसमें कुछ नए features हैं जो वेबसाइट को और ज्यादा interactive और user friendly बनाती है और हैं:

  1. html5 ज्यादा mobile friendly है| इसके ज्यादा तर features mobile में support करतें हैं |
  2. html5 में <audio> और <video> tags के जरिये आसानी से multimedia को support कर सकती है |
  3. JS Web worker API के जरिये html5 javascript को browser में run होने में support करता है |
  4. html5 में canvas और SVG के जरिये vector graphics को आसानी से support किया जाता है |
  5. circle, rectangle, triangle जैसे आकार बनाना आसान है |
  6. इसमें drag और drop effect डाला जा सकता है |
  7. ये सारे नए browsers को support करता है |

Q.19) html में empty tag क्या है ?

answer : html में कुछ tags ऐसे हैं जिनकी closing tag नहीं होती यानि इसे /> सिंबल के जरिये बंद करने की जरुरत नहीं पड़ती | ऐसे tags को empty tags कहा जाता है |

<hr>, <br> tags आदि empty tags हैं |

<br> tag जिसे break line tag कही जाती है | इसका इस्तेमाल content या elements के बिच break line देने के लिए इस्तेमाल किया जाता है |

उदाहरण: <p>HTML is hypertext language <br> jquery is a scripting language</p>

<hr> tag horizontal line देने के लिए इस्तेमाल किआ जाता है |

उदाहरण: <p>HTML is hypertext language</p> <hr> <p>jquery is a scripting language</p>

Q.20) <pre> tag का क्या उपयोग है ?

answer : html एक से अधिक white spaces को मिलाकर एक space बना देता है | अगर हम html कोड में कुछ text जैसे लिखें वैसे ही दिखाना चाहतें हैं या फिर जितनी white space लगायें हैं उतना ही आनि चाहिए | तो ऐसे text को <pre> tag के अंदर लिख सकतें हैं |

<pre> tag के अंदर लिखी content को html वैसे ही दिखाता जैसे इसमें लिखा हुआ होता है | वो नाही extra white spaces को merge करता है नाही content में कोई बदलाव करता है |

उदाहरण: 

<html>
 <head>
 </head>
 <body>
  <div>
   <pre>jquery is a     scripting    language</pre>    
  </div>
 </body>
</html>

आउटपुट

pre tag example

Q.21) image spriting क्या है और इसका उपयोग क्या होता है?

Answer: image spriting के जरिये एक webpage की सारी static images को merge करके एक single image बनाया जाता है | और जब ये load हो जाता है तब background-position के जरिये इसकी individual image को इसकी सही position पे set की जाती है |

image spriting के जरिये website की performance को बढ़ती है | server पे load कम पड़ता है और website की loading speed बढती है |

Q.22) HTML5 में कोन कोनसे नए html form element types introduce की गयी है ?

Answer: HTML5 में 10 नए html form element types introduce की गयी है और वो है:

  1. Color
  2. Date
  3. Datetime-local
  4. Email
  5. Time
  6. Url
  7. Range
  8. Telephone
  9. Number
  10. Search

Q.23) HTML5 में canvas क्या है?

Answer: HTML5 में canvas का उपयोग graphics बनाने में की जाती है |

canvas tag और javascript code के जरिये html में graphics draw की जाती है |

Syntax: <canvas>content</canvas>

Q.24) SVG क्या है?

Answer: Webpages में vector graphic define करने के लिए, HTML5 में SVG technology को introduce किया गया है | SVG का full form है Scalable Vector Graphics |

SVG के जरिये webpages में two-dimensional vector graphics(2D vector graphics) बना सकतें हैं |

Q.25) Audio और video tags क्या है?

Answer: html में किसी sound file को जोड़ने के लिए <audio> tag का इस्तेमाल होता है | sound file जैसे कोई music, या song या कोई अन्य recording को किसी वेबपेज में रखना हो, तो उसे <audio> के मदद से की जा सकती है |

html में किसी video file को जोड़ने के लिए <video> tag का इस्तेमाल होता है | video file जैसे की कोई video clip या कोई video recording किसी वेबसाइट में दिखाना हो तो, html में <video> tag के जरिये कर सकतें हैं |

अन्य सुझाव