HTML COMPUTER CODE


There are few tags in HTML which let us represent computer codes, programs or outputs on the webpage. Since computer codes are different from simple texts so these tags are used to differentiate between simple text and computer codes.

The HTML tags that are used for these purposes are as follows:

  1. HTML code tag
  2. HTML kbd tag
  3. HTML samp tag
  4. HTML var tag


1. HTML code tag

Sometimes we need to show computer code or programs on the screen which could be done by another tag also but we have a special tag for this purpose <code>.

The <code> is used to display computer codes on the webpage.

Syntax:

<code> ...computer codes... </code>

The <code> tag contents are displayed by fixed width,spacing and font-size.

<code>
    var a = 10; <br> /*This is javascript code.*/ 
    var b = 12; <br> /*You can learn javascript in our javascript section*/
    var c = a + b; <br>
    console.log(c);
</code>
Try It

Output:

var a = 10;
var b = 12;
var c = a + b;
console.log(c);

2. HTML kbd tag

The kbd is used to display keyboard inputs.

The kbd tag is generally monospaced.

This tag has no specific attribute.

Syntax:

<kbd> ...keyboard input... </kbd>

The <kbd> tag can be given a better look using CSS.

<kbd>
    ctrl a; <br> 
    ctrl c; <br>
    ctrl v; <br>
</kbd>
Try It

Output:

    ctrl a;
ctrl c;
ctrl v;

3. HTML samp tag

The samp is used to display computer output or any kind of result or error.

The samp tag display content monospaced.

Syntax:

<samp> ...contents... </samp>
<samp>
    error<br> 
    successful<br>
    run time error<br>
</samp>
Try It

Output:

    error
    successful
    run time error

4. HTML var tag

The var is used to define any variable in mathematics or in computers.

Syntax:

<var> ...contents... </var>

It can be given CSS properties for better look.

<var>f</var> = <var>m*a</var>
<var>E</var> = <var>m*c<sup>2</sup></var>
Try It

Output:

And god said:
f = m*a
E = MC2