HTML <code> Tag

The <code> tag displays a small fragment of computer code. By default, the text is rendered in the browser‘s standard monospace font.

HTML Tag

Example

#

A <code> tag.
It marks 'alert()' as computer code.

In JavaScript the alert() method displays an alert box.

<p>In JavaScript the <code>alert()</code> method displays an alert box.</p>

Using <code>

The <code> tag displays text as computer code.

The text inside displays as pre-formatted text, typically a fixed-width font.

CSS can be used to override the default font and styling of the <code> element.

Attributes for <code>

The <code> element has no attributes, but it does accept global attributes.
The following are commonly used.

Attribute Value Description
id    value Provides the code element with a unique identifier.
class    classnames Assigns one or more classnames to the code element.
style    CSS-values Assigns CSS style values to the code element.

For additional global attributes see our global attributes list.


Phrase tags

Phrase tags highlight the meaning of a small piece of text (i.e. a phrase).

The <code> tag is one of them, but there several others.

A list of all HTML Phrase tags.

Tag Description
<em> Indicates emphasized text
<strong> Indicates important text
<code> Indicates computer code
<samp> Indicates sample output from a computer program
<kbd> Indicates keyboard input
<var> Indicates a variable

Did you know?

Did you know?

Don't include HTML code directly in a <code> tag

The browser converts HTML tags automatically to HTML objects before the page is rendered.

With this, you cannot directly include HTML code as plain text in the <code> element.

To display HTML code, the <, >, &, and other characters need to be replaced with HTML entities.

For example, replace < with &lt;,   > with &gt;,  and & with &amp;.


Code Tags

The <code> tag is part of a group of tags that create coding (programming) related features on web pages. This group is referred to as the Code tag group. Together, these tags allow you to create code-friendly pages.

A list of code tags.

Element Description
<pre> Displays pre-formatted text in fixed-width font -- usually computer code
<code> An element that is used to display computer code
<samp> Displays sample output from a coumputer code
<output> Displays output results of a calculation
<var> Defines its content as a variable
<!--...--> Marks text as comments in the source code. Not visible to users

Browser support

Here is when <code> support started for each browser:

Chrome
1.0 Sep 2008
Firefox
1.0 Sep 2002
IE/Edge
1.0 Aug 1995
Opera
1.0 Jan 2006
Safari
1.0 Jan 2003

You may also like

Guides