Referencia rápida de Markdown
Markdown es un conjunto de convenciones para escribir texto formateado en un archivo plano, y su atractivo es que el código fuente sigue siendo legible incluso cuando nada lo renderiza. La sintaxis a continuación está agrupada por lo que intentas hacer, y cada fila muestra el HTML que realmente produce.
Estos fragmentos HTML no están escritos a mano. Cada uno es la salida real del conversor de Markdown del sitio, comparado con la tabla por el conjunto de pruebas en cada compilación, así que si una fila y la herramienta discreparan, la compilación fallaría en lugar de que la página te engañe.
El dialecto es CommonMark más las extensiones de GitHub que son casi universales: tablas, listas de tareas y tachado. Las notas al pie, las listas de definiciones y las directivas están deliberadamente ausentes, porque documentar una sintaxis que luego no hace nada en el conversor a un clic de distancia es peor que omitirla.
Énfasis e código en línea
9La sintaxis en línea funciona dentro de párrafos, encabezados, elementos de lista e celdas de tabla.
| Sintaxis | Qué hace | HTML producido |
|---|---|---|
| *italic* | Cursiva | <p><em>italic</em></p> |
| _italic_ | Cursiva, forma alternativaIgnorado dentro de una palabra, así que snake_case sobrevive. | <p><em>italic</em></p> |
| **bold** | Negrita | <p><strong>bold</strong></p> |
| __bold__ | Negrita, forma alternativa | <p><strong>bold</strong></p> |
| ***both*** | Negrita e cursiva juntas | <p><em><strong>both</strong></em></p> |
| ~~gone~~ | Tachado | <p><del>gone</del></p> |
| `code` | Código en línea—nada dentro se interpreta | <p><code>code</code></p> |
| ``a ` b`` | Código en línea que contiene una comilla invertidaUsa más comillas invertidas afuera que aparezcan adentro. | <p><code>a ` b</code></p> |
| \*not italic\* | Un asterisco literal en lugar de énfasis | <p>*not italic*</p> |
Encabezados
7La forma hash es la que debes usar; la forma de subrayado solo alcanza dos niveles.
| Sintaxis | Qué hace | HTML producido |
|---|---|---|
| # Heading | Encabezado de nivel 1 | <h1>Heading</h1> |
| ## Heading | Encabezado de nivel 2 | <h2>Heading</h2> |
| ### Heading | Encabezado de nivel 3 | <h3>Heading</h3> |
| ###### Heading | Encabezado de nivel 6—el más profundo que hay | <h6>Heading</h6> |
| Heading ======= | Encabezado de nivel 1, forma subrayada | <h1>Heading</h1> |
| Heading ------- | Encabezado de nivel 2, forma subrayada | <h2>Heading</h2> |
| ## Heading ## | Los hashes finales son decoración e se descartanEl recuento en la derecha se ignora; solo el izquierdo establece el nivel. | <h2>Heading</h2> |
Listas
7Sangría por dos espacios para anidar. Una línea en blanco entre elementos hace que cada uno sea un párrafo.
| Sintaxis | Qué hace | HTML producido |
|---|---|---|
| - one - two | Lista viñetada | <ul> <li>one</li> <li>two</li> </ul> |
| * one * two | Lista viñetada, marcador alternativo | <ul> <li>one</li> <li>two</li> </ul> |
| 1. one 2. two | Lista numerada | <ol> <li>one</li> <li>two</li> </ol> |
| 1. one 1. two | También una lista numerada, renumerada al renderizarSolo se usa el primer número; el resto puede ser 1. | <ol> <li>one</li> <li>two</li> </ol> |
| - one - nested | Lista anidada—sangría el elemento secundario por dos espacios | <ul> <li>one <ul> <li>nested</li> </ul></li> </ul> |
| - [ ] todo | Elemento de lista de tareas sin marcar | <ul> <li><input type="checkbox" disabled /> todo</li> </ul> |
| - [x] done | Elemento de lista de tareas marcado | <ul> <li><input type="checkbox" checked disabled /> done</li> </ul> |
Enlaces e imágenes
6| Sintaxis | Qué hace | HTML producido |
|---|---|---|
| [text](https://a.co) | Enlace | <p><a href="https://a.co">text</a></p> |
| [text](https://a.co "Tip") | Enlace con un título de sugerencia | <p><a href="https://a.co" title="Tip">text</a></p> |
| <https://a.co> | URL desnudo convertido en un enlace | <p><a href="https://a.co">https://a.co</a></p> |
| [mail](mailto:[email protected]) | Enlace de correo electrónico | <p><a href="mailto:[email protected]">mail</a></p> |
|  | Imagen, con texto alternativo | <p><img src="cat.png" alt="alt" /></p> |
| [x](javascript:alert(1)) | Esquema no seguro—el enlace se elimina, el texto se quedaLas URLs javascript:, data: e vbscript: pierden su href. | <p>x</p> |
Elementos de bloque
9Cada uno de estos debe comenzar al principio de una línea.
| Sintaxis | Qué hace | HTML producido |
|---|---|---|
| > quoted | Cita en bloque | <blockquote> <p>quoted</p> </blockquote> |
| > > deeper | Cita en bloque anidada | <blockquote> <blockquote> <p>deeper</p> </blockquote> </blockquote> |
| ``` code ``` | Bloque de código cercado | <pre><code>code </code></pre> |
| ```js let a = 1; ``` | Bloque de código cercado con una clase de idioma para resaltado | <pre><code class="language-js">let a = 1; </code></pre> |
| code | Bloque de código por sangría de cuatro espacios | <pre><code>code </code></pre> |
| --- | Regla horizontal | <hr /> |
| *** | Regla horizontal, forma alternativa | <hr /> |
| one two | Salto de línea dentro de un párrafoDos espacios finales. Invisible en la mayoría de editores, por eso tan frecuentemente falla. | <p>one<br /> two</p> |
| one two | Una línea en blanco separa párrafos | <p>one</p> <p>two</p> |
Tablas
4La fila delimitadora es lo que la hace tabla. La alineación se establece por dos puntos en esa fila.
| Sintaxis | Qué hace | HTML producido |
|---|---|---|
| | a | b | | - | - | | 1 | 2 | | Tabla—fila de encabezado, fila delimitadora, luego filas de cuerpo | |
| | :--- | | Alinea la columna a la izquierda, en la fila delimitadora | |
| | :---: | | Centra la columna | |
| | ---: | | Alinea la columna a la derecha |