HTML Computer Code Elements

HTML Computer Code Elements


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


Example

Try it Yourself »


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:

Result:

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:

Result:

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:

Try it Yourself »

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

To fix this, you can put the <code> element inside a <pre> element:

Example

Result:

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:

Result:

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

HTML Exercises

Test Yourself With Exercises

Exercise:

Define the text “var person;” as programming code.

 

Start the Exercise


HTML Computer Code Elements

Tag Description
<code> Defines programming code
<kbd> Defines keyboard input
<samp> Defines computer output
<var> Defines a variable
<pre> Defines preformatted text

For a complete list of all available HTML tags, visit our HTML Tag Reference.

ArmenianEnglish