वेब पेज पर कंप्यूटर कोड प्रदर्शित करने के लिए, HTML में कुछ एलिमेंट्स प्रदान किए गए हैं। आइए उन एलिमेंट्स को एक-एक करके देखें:
- <kbd>
- <pre>
- <code>
- <var>
- <samp>
HTML में <kbd> एलिमेंट
<kbd> टैग का उपयोग कीबोर्ड इनपुट को परिभाषित करने के लिए किया जाता है। इसका उपयोग तब करें जब आप चाहते हैं कि उपयोगकर्ता अपने कीबोर्ड पर टाइप करे, उदाहरण के लिए, शॉर्टकट कीज़ Ctrl+C कॉपी के लिए, Esc एग्जिट के लिए, आदि।
आइए अब <kbd> टैग को लागू करने का एक उदाहरण देखें:
उदाहरण
<!DOCTYPE html> <html> <body> <h2>Shortcut Keys</h2> <p>Use the following shortcut keys −</p> <p><strong>Cut</strong> − <kbd>CTRL</kbd>+<KBD>X</kbd></p> <p><strong>Copy</strong> − <kbd>CTRL</kbd>+<KBD>C</kbd></p> <p><strong>Paste</strong> − <kbd>CTRL</kbd>+<KBD>V</kbd></p> <p><strong>Undo</strong> − <kbd>CTRL</kbd>+<KBD>Z</kbd></p> </body> </html>
आउटपुट
HTML में <pre> एलिमेंट
HTML में <pre> टैग का उपयोग प्रीफॉर्मेटेड टेक्स्ट सेट करने के लिए किया जाता है। इसमें टेक्स्ट स्पेस और लाइन ब्रेक को संरक्षित करता है यानी टेक्स्ट वेब पेज पर वैसा ही दिखाई देता है जैसा HTML कोड के तहत जोड़ा गया है। आइए अब <pre> टैग को लागू करने का एक उदाहरण देखें:
उदाहरण
<!DOCTYPE html> <html> <body> <h2>Demo Heading</h2> <pre> This is a demo text and will appear in the same format as it is visible here. The pre tag displays the text in a fixed-width font. It preserves both spaces and line breaks as you can see here. </pre> </body> </html>
आउटपुट
HTML में <code> एलिमेंट
<code> टैग का उपयोग HTML डॉक्यूमेंट में कोड को फॉर्मेट करने के लिए किया जाता है। उदाहरण के लिए, यदि आप Java कोड लिखना चाहते हैं और इसे ठीक से फॉर्मेट करना चाहते हैं, तो HTML में <code> एलिमेंट का उपयोग करें। आइए अब HTML में <code> एलिमेंट को लागू करने का एक उदाहरण देखें:
उदाहरण
<!DOCTYPE html> <html> <body> <h1>Header Files</h1> <h2>C++</h2> <code> #include <iostream> </code> <h2>C</h2> <code> #include <stdio> </code> </body> </html>
आउटपुट
HTML में <var> एलिमेंट
HTML में <var> एलिमेंट का उपयोग गणनाओं के लिए गणितीय अभिव्यक्ति प्रदर्शित करने के लिए किया जाता है।
आइए अब HTML में <var> टैग को लागू करने का एक उदाहरण देखें:
उदाहरण
<!DOCTYPE html> <html> <body> <h2>Mathematical Equation</h2> Sample equation − <var>2x</var> - <var>2z</var> = <var>3y</var> + 9 </body> </html>
आउटपुट
HTML में <samp> एलिमेंट
HTML में <samp> टैग <em>, <code>, <strong>, आदि की तरह एक फ्रेज़ टैग है और HTML डॉक्यूमेंट में टेक्स्ट को फॉर्मेट करने के लिए उपयोग किया जाता है।
आइए अब <samp> एलिमेंट को लागू करने का एक उदाहरण देखें:
उदाहरण
<!DOCTYPE html> <html> <body> <h2>Exam Results</h2> <p><s>Result would be announced on 6th June.</s></p> <samp>New date for results are 7th June.</samp> </body> </html>
आउटपुट
