❮ Previous Next ❯

HTML Code Collection

In this page, we will learn about HTML code collections. It includes the following tags.

  1. <code> tag
  2. <var> tag
  3. <kbd> tag
  4. <samp> tag

1. <code> tag

It defines enclosed text as a computer code. The texts within the <code> element is monospace font-family.

Full code example

<!DOCTYPE html>
<html>
<head>
<title>
Computer code
</title>
</head>
<body>
<code>
  x = 10,
  y = 20,
  x + y = 30.
</code>
</body>
</html>
Run The code »

Output on the browser

x = 10, y = 20, x + y = 30.

By default, <code> tag do not preserve any line space or line break. Enclose them within the <pre> element to preserve it.

<pre>
 <code>
  x = 10,
  y = 20,
  x + y = 30.
 </code>
</pre>

2. <var> tag

It defines either mathematic or promgramming variable. The texts within the <var> element is italic style.

Full code example

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>
Linear momentum, <var> p=mv </var>
</p>
</body>
</html>
Run The code »

Output on the browser

Linear momentum, p=mv

3. <kbd> tag

It defines keyboard input like shortcut, command prompt. The text within this element will display in the monospace font-family.

Full code example

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<!--Right Form-->
 <p> To undo last action, press <kbd> Ctrl + z </kbd>. </p>
<!--Wrong Form-->
 <p> To undo last action, press Ctrl + z. </p>
</body>
</html>
Run The code »

To undo last action, press Ctrl + z .

To undo last action, press Ctrl + z.

4. <samp> tag

It defines an output from a computer program. The text within this element will display in the monospace font-family.

Full code example

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<!--Right Form-->
 <p> Wrong output comes with <samp>Error!</samp>. </p>
<!--Wrong Form-->
 <p> Wrong output comes with Error!. </p>
</body>
</html>
Run The code »

Wrong output comes with Error!.

Wrong output comes with Error!.

Difference between <code>, <var>, <kbd> and <samp> tag

Tag Note
<code> It defines computer code.
<var> It defines variable.
<kbd> It defines user input.
<samp> It shows program output.
❮ Previous Next ❯