HTML <Code> Tag

Definition

The <code> element is used to define a fragment or piece of computer code. It will display any text wrapped by <code> tags in the browser’s default monospace font.

Example

<p>The <code>&lt;code&gt;</code> element denotes a piece of code.</p>

Usage

• The <code> element is used to mark up a piece of computer code. This could be an XML element name, file name, computer program, or any other string recognizable by a computer.
• To display a single line of code, you can just use the code tags.
• To show multiple lines of code, you should wrap the <code> element with <pre> tags. For example:

  <pre><code class="language-pascal">var i: Integer;
  begin
    i := 1;
  end.</code></pre>

  Try it Yourself
• You must use a starting and closing tag.

Attributes

The Code element only supports the Global Attributes.

Best Practices

• It is recommended to use a syntax highlighting script to automatically mark up the code’s styling to make it easier to read. Most scripts allow you to set a specific language, such as HTML, CSS, or JavaScript.

  You can find several syntax highlighting plugins for WordPress here. This website uses Chroma.

• When displaying the results of any code snippets on your page, you will need to escape characters such as ", &, <, and > as they are reserved in HTML.

  You should replace them with their corresponding HTML entities so that the browser does not interpret them. This HTML Escape / Unescape tool can help.

Specification

• HTML Living Standard Specification
• HTML5 Specification

Browser Support

Desktop

Mobile