Markdown Code/Code Blocks

❮ Previous Home Next ❯

Code

You can denote a word or phrase as code, enclose it in backticks `.

Syntax:

`word or phrase`
Markdown HTML Output
This is `code` text. <p>This is <code>code</code> text.</p>

This is code text.




Example

This is `code` text.



Escaping Backticks

If the word or phrase you want to denote as code includes one or more backticks, you can escape it by enclosing the word or phrase in double backticks ``.

Syntax:

``word `or` phrase``
Markdown HTML Output
``This is `code` text.`` <code>This is `code` text.</code> This is `code` text.



Example

``This is `code` text.``






Code Blocks

You can create code blocks by indent every line of the block by at least four spaces or one tab.

Syntax:

    Code Blocks
Markdown HTML Output
<p>This is code blocks.</p> &lt;p&gt;This is code blocks.&lt;/p&gt; <p>This is code blocks.</p>

Note: Always remember to add at least four spaces or one tab otherwise it act as normal line instead of code blocks.

Example

    <!DOCTYPE html>
    <html>
    <head>
      <title>Code Blocks</title>
    </head>
    <body>
      <p>This is paragraph</p>
    </body>
    </html>



Code Fencing Block

The basic Markdown syntax allows you to create code blocks by indenting lines by four spaces or one tab.

You can use fenced code blocks by use three backticks ``` or three tildes ~~~ on the lines before and after the code block.

It is depends on your Markdown processor or editor, and you don’t have to indent any lines!

Syntax:

```

Code Blocks

```

or

~~~

Code Blocks

~~~

Example

```
{
  "firstName": "John",
  "lastName": "Smith",
  "age": 25
}
```



If you don't want to indent this would be great option:

Example

```html
<!DOCTYPE html>
<html>
<head>
  <title>Code Blocks</title>
</head>
<body>
  <p>This is paragraph</p>
</body>
</html>
```



Code Block Highlighting

There are many Markdown processors support syntax highlighting for fenced code blocks.

This feature allows you to add color highlighting for whatever language your code was written in.

To add syntax highlighting, specify a language next to the backticks before the fenced code block, for example html, javascript, css, json and many more it's depends on your markdown editor.

Syntax:

```language

Code Blocks

```

or

~~~

Code Blocks

~~~

Example

```json
{
  "firstName": "John",
  "lastName": "Smith",
  "age": 25
}
```

Note - Not all Markdown applications support this, so it is not a great option from a compatibility perspective.




Related Pages

HTML reference: HTML <code> tag

❮ Previous Home Next ❯