HTMLComputer Code Elements

HTML contains several elements for defining user input and computer code.

Example

HTML <kbd> For Keyboard Input

The HTML<kbd> element is used to define keyboard input. The content inside is displayed in the browser's default monospace font.

Example

Define some text as keyboard input in a document:

Save the document by pressing <kbd>Ctrl + S</kbd>

Result:

Save the document by pressingCtrl + S

Try it Yourself »

HTML <samp> For Program Output

The HTML<samp> element is used to define sample output from a computer program. The content inside is displayed in the browser's default monospace font.

Example

Define some text as sample output from a computer program in a document:

Message from my computer:
<samp>File not found. Press F1 to continue</samp>

Result:

Message from my computer:

File not found. Press F1 to continue

Try it Yourself »

HTML <code> For Computer Code

The HTML<code> element is used to define a piece of computer code. The content inside is displayed in the browser's default monospace font.

Example

Define some text as computer code in a document:

Result:

x = 5; y = 6; z = x + y;

Try it Yourself »

Preserve Line-Breaks

Notice that the<code> element does NOT preserve extra whitespace and line-breaks.

To preserve extra whitespace and line-breaks, you can put the<code> element inside a<pre> element:

Example

Result:

x = 5;
y = 6;
z = x + y;

Try it Yourself »

HTML <var> For Variables

The HTML<var> element is used to define a variable in programming or in a mathematical expression. The content inside is typically displayed in italic.

Example

Define some text as variables in a document:

The area of a triangle is: 1/2 x <var>b</var> x <var>h</var>, where <var>b</var> is the base, and <var>h</var> is the vertical height.

Result:

The area of a triangle is: 1/2 xb xh, whereb is the base, andh is the vertical height.

Try it Yourself »

Chapter Summary

The<kbd> element defines keyboard input
The<samp> element defines sample output from a computer program
The<code> element defines a piece of computer code
The<var> element defines a variable in programming or in a mathematical expression
The<pre> element defines preformatted text