HTML Computer Code Elements

To display user input, code, and program outputs, we have specific elements in HTML5.

HTML <kbd> Element

<kbd> stand for keyboard, and it is used to represent keyboard shortcut keys and other input or voice commands. The bowser show <kbd> content in monospace font style.

Example

<p> To close the window press <kbd>Alt + f4</kbd></p>

Output

To close the window press Alt + f4

HTML <samp> Element

The <samp> element is used to define the computing or ouput result of a program . It is similar to <kbd> element and display its content in monospace font style.

Example

<p><samp>Error: </samp>The entered value is not a number </p>

Output

Error:

The entered value is not a number

HTML <code> element

As its name suggests, <code> element is used to display code text in the web browser. It does not preserve the whitespace between its content, which mean if you have provided more than one space between its content, then it would be replaced by single space.

Example

<code>
int a, b, sum =0;
a= 10;
b= 30;
sum = a+b;
</code>

Output

int a, b, sum =0; 
a= 10; 
b= 30; 
sum = a+b;

To preserve the white spacing and new line use <pre> or preformatted element.

Example

<pre>
<code> 
int a, b, sum =0; 
a= 10; b= 30; 
sum = a+b; 
</code>
</pre>

HTML <var> Element

The <var> element is used to represent mathematical variables on the document. Generally all the mathematical expression represented using <var> element.

Example

(<var>a</var>+<var>b</var>) <sup> 2</sup> = 
<var>a</var><sup>2</sup>+ 
<var>+</var><sup>2</sup> + 
2<var>a</var><var>b</var>

Output

(a+b) 2 = a2+ +2 + 2ab