• +91-9142290450

  • Hajipur, Bihar, 844101

☰
❮
❯

HTML Computercode

← Previous Next →

HTML provides several tags to display computer-related content such as code snippets, keyboard input, and program output. These tags help preserve formatting and convey technical meaning clearly.

🔹 Common Computercode Tags in HTML

Tag Purpose
<code> Displays code in a monospace font
<kbd> Indicates keyboard input
<samp> Represents sample output from a program
<var> Displays a variable in programming context
<pre> Preserves formatting and whitespace
✅ <code> – Code Snippet

Displays code in monospace font (does not preserve whitespace).

<p>This is <code>console.log("Hello")</code> in JavaScript.</p>
✅ <pre> – Preformatted Text

Preserves spaces, line breaks, and tabs as they appear.

<pre>
function hello() {
  console.log("Hello World");
}
</pre>
✅ <kbd> – Keyboard Input

Represents input from the user via keyboard.

<p>Press <kbd>Ctrl</kbd> + <kbd>C</kbd> to copy text.</p>
✅ <samp> – Sample Output

Used to show the output of a program or command.

<p>Output: <samp>Hello, user!</samp></p>
✅ <var> – Variable

Represents a variable in code, usually styled in italic by default.

<p>The value of <var>x</var> is 10.</p>

🧾 Example: All Computercode Tags Together

<pre>
<code>
let x = 10;
let y = 20;
console.log(x + y);
</code>
</pre>

<p>Type <kbd>Alt</kbd> + <kbd>F4</kbd> to close the window.</p>

<p>Sample Output: <samp>30</samp></p>

<p>Here, <var>sum</var> stores the result.</p>

Practice Questions

Q1. Write a JavaScript function using <pre> and <code> tags.

Q2. Use <kbd> to show keyboard shortcuts for copying text.

Q3. Display a sample output using the <samp> tag.

Q4. Highlight the variable total using the <var> tag.

Q5. Show a command-line snippet using <code> inside <pre>.

Q6. Create a layout showing input (with <kbd>) and output (with <samp>).

Q7. Nest <code> inside <pre> for correct formatting.

Q8. Use <kbd> to show a shortcut to refresh a page.

Q9. Display a Python print() statement using <code>.

Q10. Highlight multiple variables in a paragraph using <var>.

← Previous Next →

HTML

online coding class codepractice

HTML5 Basics

HTML Styling and Design

HTML Links and Media

HTML Layout and Structure

HTML Forms

HTML Graphics

HTML APIs

HTML Advanced Topics

codepractice logo
Login
Go Back Top