#markdown

Guía de Markdown

Colección de ejemplos para generar contenido HTML a partir de archivos Markdown.

1. Encabezados

Crea jerarquías de títulos con el carácter #. Mientras más #, menor el nivel del encabezado.

example.md

# Encabezado de nivel 1

## Encabezado de nivel 2

### Encabezado de nivel 3

#### Encabezado de nivel 4

##### Encabezado de nivel 5

###### Encabezado de nivel 6

Encabezado de nivel 1

Encabezado de nivel 2

Encabezado de nivel 3

Encabezado de nivel 4

Encabezado de nivel 5

Encabezado de nivel 6

example.md

Display heading 1 {.display-1}

Display heading 2 {.display-2}

Display heading 3 {.display-3}

Display heading 4 {.display-4}

Display heading 1

Display heading 2

Display heading 3

Display heading 4

2. Párrafos

Los saltos de línea se generan dejando líneas en blanco o usando \\ para forzar un salto manual.

example.md

Realmente me gusta usar Markdown.

Creo que lo usaré para formatear
todos mis documentos de ahora en adelante.

Realmente me gusta usar Markdown.

Creo que lo usaré para formatear todos mis documentos de ahora en adelante.

example.md

Realmente me gusta usar Markdown.

Creo que lo usaré para formatear \
todos mis documentos de ahora en adelante.

Realmente me gusta usar Markdown.

Creo que lo usaré para formatear
todos mis documentos de ahora en adelante.

example.md

Estoy al centro. {.text-center}

Estoy al centro.

example.md

"Solo es joven aquél que sigue aprendiendo." {.text-right}

JULIAN ZINI {.text-right}

"Solo es joven aquél que sigue aprendiendo."

JULIAN ZINI

3. Énfasis

Combina asteriscos y tildes para aplicar negrita, cursiva, tachado o resaltar fragmentos de código en línea.

example.md

Este es un **texto en negrita**.

Este es un texto en negrita.

example.md

Este es un _texto en cursiva_.

Este es un texto en cursiva.

example.md

Este es un texto **_muy importante_**.

Este es un texto muy importante.

example.md

Este es un ~~texto tachado~~.

Este es un texto tachado.

example.md

Este es un `fragmento de código`.

Este es un fragmento de código.

4. Bloques de texto

Utiliza el símbolo > para crear citas y mensajes resaltados. Puedes anidar niveles o agregar listas dentro del bloque.

example.md

> Dorothy la siguió por muchas habitaciones preciosas de su castillo.

Dorothy la siguió por muchas habitaciones preciosas de su castillo.

example.md

> Dorothy la siguió por muchas habitaciones preciosas de su castillo.
>
> La Bruja le ordenó que limpiara las ollas y teteras, que barriera el suelo
> y mantuviera el fuego alimentado con madera.

Dorothy la siguió por muchas habitaciones preciosas de su castillo.

La Bruja le ordenó que limpiara las ollas y teteras, que barriera el suelo y mantuviera el fuego alimentado con madera.

example.md

> Dorothy la siguió por muchas habitaciones preciosas de su castillo.
>
> > La Bruja le ordenó que limpiara las ollas y teteras, que barriera el suelo
> > y mantuviera el fuego alimentado con madera.

Dorothy la siguió por muchas habitaciones preciosas de su castillo.

La Bruja le ordenó que limpiara las ollas y teteras, que barriera el suelo y mantuviera el fuego alimentado con madera.

example.md

> ### ¡Los resultados trimestrales se ven geniales!
>
> - Los ingresos estaban fuera de la tabla.
> - Las ganancias fueron **_más altas_** que nunca.
>
> _Todo_ está yendo **_según_** el **plan**.

¡Los resultados trimestrales se ven geniales!

  • Los ingresos estaban fuera de la tabla.
  • Las ganancias fueron más altas que nunca.

Todo está yendo según el plan.

example.md

> Este es un `mensaje`.

> Este es un `mensaje` de éxito.
> {.text-success}

> Este es un `mensaje` de información.
> {.text-info}

> Este es un `mensaje` de advertencia.
> {.text-warning}

> Este es un `mensaje` de peligro.
> {.text-danger}

Este es un mensaje.

Este es un mensaje de éxito.

Este es un mensaje de información.

Este es un mensaje de advertencia.

Este es un mensaje de peligro.

5. Listas

example.md

1. Primer item
2. Segundo item
3. Tercer item
  1. Primer item
  2. Segundo item
  3. Tercer item

example.md

- Primer item
- Segundo item
- Tercer item
  • Primer item
  • Segundo item
  • Tercer item

example.md

1. Primer item
2. Segundo item
3. Tercer item
   - Subitem
   - Subitem
4. Cuarto item
  1. Primer item
  2. Segundo item
  3. Tercer item
    • Subitem
    • Subitem
  4. Cuarto item

example.md

- Primer item
- Segundo item
- Tercer item
  1. Subitem
  2. Subitem
- Cuarto item
  • Primer item
  • Segundo item
  • Tercer item
    1. Subitem
    2. Subitem
  • Cuarto item

example.md

- Este es el primer item de la lista.
- Este es el segundo item de la lista.

  Este párrafo pertenece al segundo item de la lista.

- Y este es el tercer item de la lista.

  • Este es el primer item de la lista.

  • Este es el segundo item de la lista.

    Este párrafo pertenece al segundo item de la lista.

  • Y este es el tercer item de la lista.

example.md

- Este es el primer item de la lista.
- Este es el segundo item de la lista.

  > Un bloque de texto se vería genial en el segundo item de la lista.

- Y este es el tercer item de la lista.

  • Este es el primer item de la lista.

  • Este es el segundo item de la lista.

    Un bloque de texto se vería genial en el segundo item de la lista.

  • Y este es el tercer item de la lista.

example.md

1.  Abre el archivo.
2.  Encuentra el siguiente boque de código:

    ```
    <html>
      <head>
        <title>Test</title>
      </head>
    ```

3.  Actualiza el título.

  1. Abre el archivo.

  2. Encuentra el siguiente boque de código:

    <html>
  <head>
    <title>Test</title>
  </head>

  3. Actualiza el título.

example.md

1.  Abre el archivo que contiene a la mascota de Linux.
2.  Maravíllate con su belleza.

    ![Tux](https://alexquispe.github.io/static/tux.png)

3.  Cierra el archivo.

  1. Abre el archivo que contiene a la mascota de Linux.

  2. Maravíllate con su belleza.

    Tux

  3. Cierra el archivo.

6. Código y archivos

Indica el lenguaje en la cerca para que el sitio aplique el resaltado correspondiente. Los atributos .line-numbers, data-title y data-line permiten mostrar números de línea, el nombre del archivo y resaltar líneas concretas.

example.md

Ejecuta `node --version` para consultar la versión de Node.js.

Ejecuta node --version para consultar la versión de Node.js.

example.md

```
app
  ├─ logs
  │  ├─ info.log
  │  ├─ warn.log
  │  └─ error.log
  ├─ logger.js
  └─ index.js
```

app
  ├─ logs
  │  ├─ info.log
  │  ├─ warn.log
  │  └─ error.log
  ├─ logger.js
  └─ index.js

example.md

```js
setTimeout(() => {
  console.log("Verás esto después de 1 segundo");
}, 1000);
```

setTimeout(() => {
  console.log("Verás esto después de 1 segundo");
}, 1000);

example.md

```js {.line-numbers data-title="vue-example.js" data-line="8-12,16"}
import Vue from "vue";
import VueI18n from "vue-i18n";

import App from "./App.vue";

Vue.use(VueI18n);

const messages = {
  en: { message: { hello: "Hello, {name}!" } },
  de: { message: { hello: "Guten Tag, {name}!" } },
};
const i18n = new VueI18n({ locale: "en", messages });

new Vue({
  render: (h) => h(App),
  i18n,
}).$mount("#app");
```

vue-example.js

import Vue from "vue";
import VueI18n from "vue-i18n";

import App from "./App.vue";

Vue.use(VueI18n);

const messages = {
  en: { message: { hello: "Hello, {name}!" } },
  de: { message: { hello: "Guten Tag, {name}!" } },
};
const i18n = new VueI18n({ locale: "en", messages });

new Vue({
  render: (h) => h(App),
  i18n,
}).$mount("#app");

example.md

```python {.line-numbers data-title="index.py"}
def saludar(nombre):
    return f"Hola, {nombre}!"

print(saludar("Ada"))
```

index.py

def saludar(nombre):
    return f"Hola, {nombre}!"

print(saludar("Ada"))

example.md

```dockerfile {.line-numbers data-title="Dockerfile"}
FROM node:22-alpine
WORKDIR /app
COPY package*.json ./
RUN npm ci --omit=dev
COPY . .
CMD ["node", "index.js"]
```

Dockerfile

FROM node:22-alpine
WORKDIR /app
COPY package*.json ./
RUN npm ci --omit=dev
COPY . .
CMD ["node", "index.js"]

example.md

```html {.line-numbers data-title="index.html" data-line="3-5,7,9"}
<!doctype html>
<html lang="es">
  <head>
    <title>Mi sitio</title>
  </head>
  <body>
    <h1>Hola, mundo</h1>
  </body>
</html>
```

index.html

<!doctype html>
<html lang="es">
  <head>
    <title>Mi sitio</title>
  </head>
  <body>
    <h1>Hola, mundo</h1>
  </body>
</html>

example.md

```json {.line-numbers data-title="package.json" data-line="2-4"}
{
  "name": "mi-aplicacion",
  "version": "1.0.0",
  "scripts": { "start": "node index.js" }
}
```

package.json

{
  "name": "mi-aplicacion",
  "version": "1.0.0",
  "scripts": { "start": "node index.js" }
}

example.md

```sql {.line-numbers data-title="schema.sql" data-line="1-4"}
CREATE TABLE tutorial (
  id INTEGER PRIMARY KEY,
  titulo TEXT NOT NULL
);
```

schema.sql

CREATE TABLE tutorial (
  id INTEGER PRIMARY KEY,
  titulo TEXT NOT NULL
);

7. Terminal y resultados

Separa los comandos de la salida que producen. El sitio reconoce variantes para una terminal normal, permisos de administrador y sesiones interactivas de Python y PostgreSQL.

example.md

Ejecuta este comando para consultar la versión de Node.js:

```bash {.cmd}
node --version
```

```{.cmd-output}
v22.0.0
```

Ejecuta este comando para consultar la versión de Node.js:

node --version

v22.0.0

example.md

```bash {.cmd-user}
whoami
```

```bash {.cmd-root}
systemctl status nginx
```

whoami

systemctl status nginx

example.md

```python {.cmd-py}
print("Hola desde Python")
```

print("Hola desde Python")

example.md

```sql {.cmd-pg}
SELECT current_database();
```

```{.cmd-output}
 current_database
------------------
 tutorial
(1 row)
```

SELECT current_database();

 current_database
------------------
 tutorial
(1 row)

example.md

```sql {.cmd-pg-test}
SELECT COUNT(*) FROM tutorial;
```

```{.cmd-output}
 count
-------
     3
(1 row)
```

SELECT COUNT(*) FROM tutorial;

 count
-------
     3
(1 row)

8. Líneas horizontales

example.md

Intenta colocar un espacio en blanco antes...

---

...y después de la línea horizontal.

Intenta colocar un espacio en blanco antes...

...y después de la línea horizontal.

9. Enlaces

example.md

Mi motor de búsqueda favorito es
[Duck Duck Go](https://duckduckgo.com).

Mi motor de búsqueda favorito es Duck Duck Go.

example.md

Mi motor de búsqueda favorito es
[Duck Duck Go](https://duckduckgo.com "El mejor motor de búsqueda").

Mi motor de búsqueda favorito es Duck Duck Go.

example.md

<https://www.markdownguide.org>

<fake@example.com>

https://www.markdownguide.org

fake@example.com

example.md

El código se encuentra bajo la licencia **[MIT](https://oss.ninja/mit)**.

Puedes encontrar más información en la
_[Guía oficial de Markdown](https://www.markdownguide.org)_.

El código se encuentra bajo la licencia MIT.

Puedes encontrar más información en la Guía oficial de Markdown.

example.md

_“En un agujero en el suelo, vivía un hobbit. No un agujero húmedo, sucio,
repugnante, con restos de gusanos y olor a fango, ni tampoco un agujero seco,
desnudo y arenoso, sin nada en que sentarse o que comer: era un [agujero-hobbit][1],
y eso significa comodidad.”_ {.text-justify}

_― J.R.R. Tolkien, The Hobbit, or There and Back Again_ {.text-right}

[1]: https://es.wikipedia.org/wiki/Hobbits "Estilo de vida Hobbit"

“En un agujero en el suelo, vivía un hobbit. No un agujero húmedo, sucio, repugnante, con restos de gusanos y olor a fango, ni tampoco un agujero seco, desnudo y arenoso, sin nada en que sentarse o que comer: era un agujero-hobbit, y eso significa comodidad.”

― J.R.R. Tolkien, The Hobbit, or There and Back Again

10. Imágenes

example.md

![Tux](https://alexquispe.github.io/static/tux.png "Tux, la mascota de Linux")

Tux

example.md

[![Tux](https://alexquispe.github.io/static/tux.png "Tux, la mascota de Linux")](https://alexquispe.github.io/static/tux.png)

Tux

example.md

![Tux](https://alexquispe.github.io/static/linux.png){.w-25} {.text-center}

Tux

11. Tablas

example.md

| Sintaxis   | Descripción |
| ---------- | ----------- |
| Encabezado | Título      |
| Párrafo    | Texto       |
SintaxisDescripción
EncabezadoTítulo
PárrafoTexto

example.md

| Sintaxis   | Descripción | Texto de prueba |
| :--------- | :---------: | --------------: |
| Encabezado |   Título    |     Esto es así |
| Párrafo    |    Texto    |           Y más |
SintaxisDescripciónTexto de prueba
EncabezadoTítuloEsto es así
PárrafoTextoY más

example.md

| Opción   | Descripción                             |
| -------- | --------------------------------------- |
| `--name` | Nombre del contenedor.                  |
| `-e`     | Describe las variables de entorno.      |
| `-d`     | Ejecuta el contenedor en segundo plano. |
| `-p`     | Expone un puerto. `host:container`      |
| `-it`    | Crea un shell bash interactivo.         |
OpciónDescripción
--nameNombre del contenedor.
-eDescribe las variables de entorno.
-dEjecuta el contenedor en segundo plano.
-pExpone un puerto. host:container
-itCrea un shell bash interactivo.

Referencias

  guide md 

Publicado: 28 de septiembre de 2026