HTML code Collections - Computer Code, Variable, Error Output and User Input

1. Computer Code

To define a code, we use the HTML Element <code>.
The texts within the <code> and <code> will be in the monospace font-family.

Example

<!DOCTYPE html>
<html>
<head>
<title> HTML Code Learning </title>
</head>
<body>
<code>
x = 3, y = 4, then, x + y = 7. <br>
</code>
</body>
</html>

Output

x = 3, y = 4, then, x + y = 7.

By Default, <code> do not preserve line space and line break. If you want to preserve both of them, write them within <pre> element.

Example

<!DOCTYPE html>
<html>
<head>
<title> HTML Code Learning </title>
</head>
<body>
<code>
<pre>
      x = 3,
      y = 4,
      then, x + y = 7.
</pre>
</code>
</body>
</html>

Output

      x = 3,
      y = 4,
      then, x + y = 7.

2. Variable

To define a variable, we use the HTML Element <var>.
The texts within the <var> and </var> will be in the italics font-family.

Example

<!DOCTYPE html>
<html>
<head>
<title> HTML Variable Learning </title>
</head>
<body>
Linear Momentum, <var> p </var> = <var> mv </var>.
</body>
</html>

Output

Linear Momentum, p = mv .

3. User Input

To define a users input or sometimes voice command, we use the HTML Element <kbd>.
The texts within the <kbd> and </kbd> will be in the monospace font-family.

Example

<!DOCTYPE html>
<html>
<head>
<title> HTML Input Learning </title>
</head>
<body>
To Undo last action, press <kbd> Ctrl + Z </kbd>.
</body>
</html>

Output

To Undo last action, press Ctrl + Z .

4. HTML <samp>

To define an output from a system, we use the HTML Element <samp>.
The texts within the <samp> and <samp> will be in the monospace font-family.

Example

<!DOCTYPE html>
<html>
<head>
<title> HTML Input Learning </title>
</head>
<body>
Wrong actions outcomes with <samp> error!. </samp>
</body>
</html>

Output

Wrong actions outcomes with error!.

Click Here, to learn <code> tag.
Click Here, to learn <pre> tag.
Click Here, to learn <var> tag.
Click Here, to learn <kbd> tag.
Click Here, to learn <samp> tag.