Sintaxis de Markdown – Tutorial básico

Markdown’s syntax is intended for one purpose: to be used as a format for writing for the web.
John Gruber

John Gruber, autor de Markdown, diseñó la sintaxis de formato de Markdown con el objetivo de hacerlo lo más legible posible. Markdown es un lenguaje de marcado simple que le permite formatear texto sin formato. Es una forma de escribir contenido para la Web. El lenguaje Markdown es fácil de aprender; tiene un mínimo de caracteres adicionales, por lo que puedes escribir rápidamente y cometer menos errores.

Sintaxis básica de Markdown

Este artículo proporciona información sobre los principales elementos de Markdown, detalles y ejemplos de la sintaxis de Markdown. Se declara una lista completa de toda la sintaxis de Markdown en la variación especificación principal de Markdown y GitLab Flavored Markdown. Todas estas funciones son compatibles con Aspose.HTML listo para usar.

Encabezados – Headers

Markdown admite dos estilos de encabezados, Setext y atx: para crear un encabezado de estilo atx, agregue signos (#) al comienzo de la línea. La cantidad de señales que utilice debe corresponder al nivel del título. Nota: Siempre coloque un espacio entre los signos numéricos (#) y el nombre del encabezado.

Alternativamente, para crear un encabezado de estilo setext, en la línea debajo del texto, agregue cualquier número de caracteres == para el nivel de encabezado 1 o caracteres -- para el nivel de encabezado 2.

Markdown Syntax	HTML	Rendered
# This is a Heading level 1	<h1>This is a Heading level 1</h1>	This is a Heading level 1
## This is a Heading level 2	<h2>This is a Heading level 2</h2>	This is a Heading level 2
### This is a Heading level 3	<h3>This is a Heading level 3</h3>	This is a Heading level 3
###### This is a Heading level 6	<h6>This is a Heading level 6</h6>	This is a Heading level 6
This is a Heading level 1 ===================	<h1>This is a Heading level 1</h1>	This is a Heading level 1
This is a Heading level 2 - - - - - - - - - - - - - - - - - - -	<h2>This is a Heading level 2</h2>	This is a Heading level 2

Énfasis – Emphasis

Markdown trata los asteriscos * y los guiones bajos (_) como indicadores de énfasis. Para poner el texto en negrita y cursiva al mismo tiempo, agregue tres asteriscos o guiones bajos antes y después de la palabra o frase. Para poner la mitad de una palabra en negrita y cursiva para darle énfasis, agregue tres asteriscos sin espacios alrededor de las letras.

Markdown Syntax	HTML	Rendered
`single asterisks`	<em>single asterisks</em>	single asterisks
`_single underscores_`	<em>single underscores</em>	single underscores
`double asterisks`	<strong>double asterisks</strong>	double asterisks
`__ double underscores__`	<strong>double underscores</strong>	double underscores
`*Bold and Italic*`	<strong><em>Bold and Italic</em></strong>	*Bold and Italic*
`___Bold and Italic___`	<strong><em>Bold and Italic</em></strong>	*Bold and Italic*
`Make text bold*and*italic at the same time`	Make text bold<strong><em>and</em></strong>italic at the same time	Make text boldanditalic at the same time

Citas en bloque – Blockquotes

El lenguaje Markdown utiliza caracteres > estilo correo electrónico para las comillas en bloque. Entonces, para crear citas en bloque, debes poner un signo > antes de la primera línea de un párrafo ajustado. Si una cita en bloque contiene varios párrafos, agregue un > en las líneas en blanco entre los párrafos. Además, las citas en bloque pueden incluir otros elementos de Markdown, incluidos encabezados, énfasis, listas o fragmentos de código: Consideremos algunos ejemplos de uso:

Markdown Syntax

Rendered

> Markdown is intended to be as easy-to-read and easy-to-write as is feasible.

> ## This is a header.
> 
> 1.   This is the first list item.
> 2.   This is the second list item.
> 
> Here’s some example code:
> 
>    using var document = new HTMLDocument();

Bloques de código de Markdown

Código

Para indicar un tramo de código en el texto del artículo, envuélvalo entre comillas invertidas (`):

Markdown Syntax	HTML	Rendered
Load the HTML file using `HTMLDocument` class	Load the HTML file using <code>HTMLDocument</code> class	Load the HTML file using `HTMLDocument`class
`Use code in your Markdown file.`	<code>Use code in your Markdown file.</code>	`Use code in your Markdown file.`

Bloques de código

Para crear un bloque de código en Markdown, sangra cada línea del bloque con al menos 4 espacios o 1 tabulación. En este ejemplo, los espacios iniciales se indican mediante puntos: (⋅):

Markdown Syntax	HTML	Rendered
This is a normal paragraph.	<p>This is a normal paragraph.</p>	This is a normal paragraph.
⋅⋅⋅⋅This is a Markdown code block.	<pre>This is a Markdown code block.</pre>	This is a Markdown code block.

Liza – Lists

Listas desordenadas

Markdown admite listas ordenadas (numeradas) y desordenadas (con viñetas). Las listas desordenadas utilizan asteriscos, signos más y guiones indistintamente como marcadores de lista. Comience las líneas con *, + o -. Para crear una lista anidada, aplique sangría a uno o más elementos:

Markdown Syntax	HTML	Rendered
- First item - Second item - Third item - Fourth item	<ul> <li>First item</li> <li>Second item</li> <li>Third item</li> <li>Fourth item</li> </ul>	First item Second item Third item Fourth item
* First item * Second item * Blue * Black	<ul> <li>First item</li> <li>Second item</li> <li>Third item</li> <li>Fourth item</li> </ul>	First itemd Second item Third item Fourth item
+ First item + Second item + Third item + Fourth item	<ul> <li>First item</li> <li>Second item</li> <li>Third item</li> <li>Fourth item</li> </ul>	First itemd Second item Third item Fourth item

Ordered Lists

To create an ordered list, add line items with numbers followed by periods. The list should start with number one. Then other numbers you use to mark the list have no impact on the HTML output Markdown gives.

Markdown Syntax

HTML

Rendered

1. Red
1. Green
1. Blue
1. Black

<ol>
<li>Red</li>
<li>Green</li>
<li>Blue</li>
<li>Black</li>
</ol>

Red
Green
Blue
Black

1. Red
2. Green
3. Blue
4. Black

<ol>
<li>Red</li>
<li>Green</li>
<li>Blue</li>
<li>Black</li>
</ol>

Red
Green
Blue
Black

1. Red
5. Green
3. Blue
8. Black

<ol>
<li>Red</li>
<li>Green</li>
<li>Blue</li>
<li>Black</li>
</ol>

Red
Green
Blue
Black

Imágenes

La sintaxis de Markdown de imagen en línea se ve así:

![Alt text for image](/path/to/img.png)
Example:
![Text "Ananuri Fortress Complex in Georgia"](georgia-castle.png)

Debe agregar un signo de exclamación (!), seguido de texto alternativo entre corchetes y la URL o ruta a la imagen entre paréntesis. Donde Alt text for image es una breve descripción de la imagen y /path/to/img.png es una ruta relativa a la imagen. El texto alternativo es útil si la imagen no se puede representar. La salida renderizada para el ejemplo georgia-castle.png se ve así:

Texto “Complejo de la Fortaleza Ananuri en Georgia”

Sintaxis de Markdown extendida

Campo de golf

Para crear un enlace, escriba el texto del enlace entre corchetes y luego sígalo con la URL entre paréntesis. La sintaxis de los enlaces se ve así:

Utilice [Markdown Converter](https://products.aspose.app/html/conversion/md) para convertir archivos Markdown a una variedad de formatos populares.

El texto del enlace renderizado se ve así:

Utilice Markdown Converter para convertir archivos Markdown a una variedad de formatos populares.

URL y direcciones de correo electrónico

Para convertir rápidamente una URL o dirección de correo electrónico en un enlace, escríbalo entre corchetes angulares:

1<https://docs.aspose.com/html/net/converting-between-formats/>
2<html@example.com>

Los enlaces representados a la URL y la dirección de correo electrónico tienen este aspecto:

https://docs.aspose.com/html/net/converting-between-formats/

html@ejemplo.com

Imagen como enlace

Para agregar un enlace a una imagen, incluya el Markdown de la imagen entre paréntesis y luego agregue el enlace entre paréntesis. La sintaxis de Markdown para una imagen como enlace se ve así:

1 [![Text "MD to PDF Converter"](/html/images/banner/md-to-pdf.png)](https://products.aspose.app/html/es/conversion/md-to-pdf)

La imagen renderizada como enlace se ve así:

Sintaxis de la tabla de Markdown

Las tablas suelen ser la mejor manera de presentar algunos datos, pero formatear tablas en Markdown es una de las más complicadas. Una tabla en Markdown consta de dos partes: el encabezado y las filas de datos de la tabla. Las tablas se crean utilizando barras verticales (|) y guiones (-). Utilice tres o más guiones (- - -) para crear el encabezado de cada columna y utilice barras verticales (|) para separar cada columna. Los dos puntos (:) se utilizan para alinear el contenido de las celdas. Los dos puntos a la izquierda del guión hacen que la columna esté alineada a la izquierda, etc.

A continuación se muestra un ejemplo de la sintaxis de una tabla Markdown:

1| Header 1       | Header 2           | Header 3       |
2| :------------- | :----------------: | -------------: |
3| Cell Content 1 | Cell Content 2     | Cell Content 3 |
4| Text           | Some long data here| Data           |

The rendered table looks like this:

Header 1	Header 2	Header 3
Cell Content 1	Cell Content 2	Cell Content 3
Text	Some long data here	Data

GitLab Flavored Markdown le permite crear tablas simples y fáciles de leer. Puede agregar fácilmente sintaxis de Markdown a las tablas, como negrita, cursiva, bloques de código, etiquetas HTML y más.

La biblioteca Aspose.HTML for .NET proporciona una API de análisis de Markdown para la plataforma C#. Puede crear, editar, guardar, fusionar, convertir archivos MD a otros formatos mediante programación y agregar enlaces, listas, bloques de código, imágenes y otros elementos en archivos Markdown.

Convertir Markdown en imagen Convertidor SVG