Saltar al contenido
MarkdownToHTML

Referencia

Chuleta de Markdown

Cada construcción central de Markdown, el HTML que produce, y cómo se renderiza. Los ejemplos se convierten en vivo en el momento de compilar con el mismo motor que el conversor.

Encabezados

De uno a seis caracteres #.

Markdown

# Heading 1
## Heading 2
### Heading 3

HTML

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>

Renderizado

Heading 1

Heading 2

Heading 3

Negrita, cursiva y tachado

El tachado necesita GFM.

Markdown

**bold**, *italic*, ***both***, ~~strikethrough~~

HTML

<p><strong>bold</strong>, <em>italic</em>, <em><strong>both</strong></em>, <del>strikethrough</del></p>

Renderizado

bold, italic, both, strikethrough

Enlaces

En línea, con título, y enlaces automáticos.

Markdown

[Inline link](https://example.com)

[With a title](https://example.com "Example")

https://example.com

HTML

<p><a href="https://example.com">Inline link</a></p>
<p><a href="https://example.com" title="Example">With a title</a></p>
<p><a href="https://example.com">https://example.com</a></p>

Imágenes

Igual que un enlace, con un ! al principio.

Markdown

![Site logo](/favicon.svg)

HTML

<p><img src="/favicon.svg" alt="Site logo"></p>

Renderizado

Site logo

Listas sin ordenar

Usa -, * o +. Indenta dos espacios para anidar.

Markdown

- Apples
- Oranges
  - Blood orange
- Pears

HTML

<ul>
  <li>Apples</li>
  <li>Oranges
    <ul>
      <li>Blood orange</li>
    </ul>
  </li>
  <li>Pears</li>
</ul>

Renderizado

  • Apples
  • Oranges
    • Blood orange
  • Pears

Listas ordenadas

Los números no tienen que ser secuenciales.

Markdown

1. First
2. Second
3. Third

HTML

<ol>
  <li>First</li>
  <li>Second</li>
  <li>Third</li>
</ol>

Renderizado

  1. First
  2. Second
  3. Third

Listas de tareas

Casillas de verificación GFM.

Markdown

- [x] Write the draft
- [ ] Publish it

HTML

<ul>
  <li><input checked="" disabled="" type="checkbox"> Write the draft</li>
  <li><input disabled="" type="checkbox"> Publish it</li>
</ul>

Renderizado

  • Write the draft
  • Publish it

Citas

Antepón > a las líneas.

Markdown

> Simple is better
> than complex.

HTML

<blockquote>
  <p>Simple is better
  than complex.</p>
</blockquote>

Renderizado

Simple is better than complex.

Código en línea

Envuelve entre comillas invertidas.

Markdown

Run `npm install` first.

HTML

<p>Run <code>npm install</code> first.</p>

Renderizado

Run npm install first.

Bloques de código

Añade un lenguaje después de la marca de apertura para el resaltado.

Markdown

```js
const answer = 42;
```

HTML

<pre><code class="hljs language-js"><span class="hljs-keyword">const</span> answer = <span class="hljs-number">42</span>;
</code></pre>

Renderizado

const answer = 42;

Tablas

GFM. Los dos puntos en la fila divisoria fijan la alineación.

Markdown

| Name | Qty |
| ---- | --: |
| Tea  |   2 |
| Milk |  10 |

HTML

<table>
  <thead>
    <tr>
      <th>Name</th>
      <th align="right">Qty</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Tea</td>
      <td align="right">2</td>
    </tr>
    <tr>
      <td>Milk</td>
      <td align="right">10</td>
    </tr>
  </tbody>
</table>

Renderizado

Name Qty
Tea 2
Milk 10

Línea horizontal

Tres o más -, * o _.

Markdown

Above

---

Below

HTML

<p>Above</p>
<hr>
<p>Below</p>

Renderizado

Above


Below

Saltos de línea

Termina una línea con dos espacios o una barra invertida, o activa "Saltos de línea como <br>".

Markdown

First line\
Second line

HTML

<p>First line<br>Second line</p>

Renderizado

First line
Second line

Escapado

Escapa caracteres especiales con una barra invertida.

Markdown

\*not italic\*

HTML

<p>*not italic*</p>

Renderizado

*not italic*

No incluido en el Markdown básico

Las notas al pie, las listas de definiciones, las matemáticas y los códigos de emoji son extensiones que este conversor no procesa. El HTML sin filtrar dentro de tu Markdown pasa sin cambios cuando Sanitizar HTML está desactivado, y se limpia cuando está activado.