HTML Computer Code Elements

By | February 21, 2021
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.

Vamware

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

HTML computer Code Elements Quick Summary

  • HTML5 has some elements to represent coding and computer text.
  • <kbd> element is used to represent input and output text.
  • <code> is used to represent the code of a programming language.
  • <samp> element represent single outputs.
  • <var> variable represents mathematic variables.

Leave a Reply

Your email address will not be published. Required fields are marked *