Type something to search...
Markdown Style Guide

Markdown Style Guide

Here is a sample of some basic Markdown syntax that can be used when writing Markdown content in Astro.

Headings

The following HTML <h1><h6> elements represent six levels of section headings. <h1> is the highest section level while <h6> is the lowest.

H1

H2

H3

H4

H5
H6

Paragraph

Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur? Quianimin porecus evelectur, cum que nis nust voloribus ratem aut omnimi, sitatur? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.

Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia is sinveli squiatum, core et que aut hariosam ex eat.

Images

Syntax

![Alt text](./full/or/relative/path/of/image)

Output

blog placeholder

blog placeholder

Blockquotes

The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a footer or cite element, and optionally with in-line changes such as annotations and abbreviations.

Blockquote without attribution

Syntax

> Tiam, ad mint andaepu dandae nostion secatur sequo quae.  
> **Note** that you can use _Markdown syntax_ within a blockquote.

Output

Tiam, ad mint andaepu dandae nostion secatur sequo quae.
Note that you can use Markdown syntax within a blockquote.

Blockquote with attribution

Syntax

> Don't communicate by sharing memory, share memory by communicating.<br>
> — <cite>Rob Pike[^1]</cite>

Output

Don’t communicate by sharing memory, share memory by communicating.
Rob Pike1Rob Pike22

Tables

Syntax

| Italics   | Bold     | Code   |
| --------- | -------- | ------ |
| _italics_ | **bold** | `code` |

Output

ItalicsBoldCode
italicsboldcode

Code Blocks

Syntax

we can use 3 backticks ``` in new line and write snippet and close with 3 backticks on new line and to highlight language specific syntax, write one word of language name after first 3 backticks, for eg. html, javascript, css, markdown, typescript, txt, bash

```html
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Example HTML5 Document</title>
  </head>
  <body>
    <p>Test</p>
  </body>
</html>
```

Output

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Example HTML5 Document</title>
  </head>
  <body>
    <p>Test</p>
  </body>
</html>

List Types

Ordered List

Syntax

1. First item
2. Second item
3. Third item

Output

  1. First item
  2. Second item
  3. Third item

Unordered List

Syntax

- List item
- Another item
- And another item

Output

  • List item
  • Another item
  • And another item

Nested list

Syntax

- Fruit
  - Apple
  - Orange
  - Banana
- Dairy
  - Milk
  - Cheese

Output

  • Fruit
    • Apple
    • Orange
    • Banana
  • Dairy
    • Milk
    • Cheese

Other Elements — abbr, sub, sup, kbd, mark

Syntax

<abbr title="Graphics Interchange Format">GIF</abbr> is a bitmap image format.

H<sub>2</sub>O

X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>

Press <kbd>CTRL</kbd> + <kbd>ALT</kbd> + <kbd>Delete</kbd> to end the session.

Most <mark>salamanders</mark> are nocturnal, and hunt for insects, worms, and other small creatures.

Output

GIF is a bitmap image format.

H2O

Xn + Yn = Zn

Press CTRL + ALT + Delete to end the session.

Most salamanders are nocturnal, and hunt for insects, worms, and other small creatures.

Footnotes

  1. The above quote is excerpted from Rob Pike’s talk during Gopherfest, November 18, 2015.

  2. The above quote is excerpted from Rob Pike’s talk during Gopherfest, November 18, 2015.

Publicaciones relacionadas

Semáforo sencillo

Semáforo sencillo

// C++ code //// Pines de los LEDs del semáforo sencillo const int LED_VERDE = 2; const int LED_AMARILLO = 3; const int LED_ROJO = 4;void setup() { // Configuración de los pines OUTPUT

read more
Web climatológica con hora

Web climatológica con hora

ÍndiceÍndice ¿Qué es una página web? Ejemplos de páginas web: [¿Cómo se construye una página web?](#cómo-se-construye-u

read more
Semáforos Coordinados

Semáforos Coordinados

Semáforos coordinados Introducción En este proyecto, vamos a crear un sistema de semáforos coordinados utilizando Arduino.

read more
Pantallas LCD

Pantallas LCD

Introducción a las Pantallas LCD Las pantallas LCD (Liquid Crystal Display) son dispositivos electrónicos utilizados para mostrar información de manera clara y eficiente. Estas pantallas son muy co

read more
Personalizar caracteres en LCD

Personalizar caracteres en LCD

ÍndiceExplicación del Código Componentes Clave del Código Librería LiquidCrystal_I2C [In

read more
Semáforo Doble

Semáforo Doble

Descripción del código Este programa controla el funcionamiento de dos semáforos simulados utilizando un Arduino. Cada semáforo cuenta con tres luces LED: verde, amarillo y rojo. El programa altern

read more
Galería Web

Galería Web

Introducción Este proyecto está diseñado para comprender las bases del desarrollo web, comenzando con HTML y CSS básicos y progresando a JavaScript interactivo. Se divide en **cuatro etapas evoluti

read more
Controlador L298N DC Motor para Arduino

Controlador L298N DC Motor para Arduino

Introduccion Si bien eventualmente necesitarás aprender a controlar motores de CC para construir tu propio robot, probablemente necesitarás algo un poco más fácil para comenzar, y ahí es donde entr

read more
Componentes HTML

Componentes HTML

import YouTubeEmbed from '../../layouts/components/YouTubeEmbed.astro'; Componentes HTML y Estilos CSS En este blog explicativo se muestran los componentes principales de HTML y estilos CSS para

read more
Portafolio web

Portafolio web

Proyecto: Página Personal o Portafolio Web Objetivo Crear una página web personal en la que se muestre:Una cabecera con tu nombre y un menú de navegación. Una sección "Sobre Mí" co

read more
Juego de adivinar el número

Juego de adivinar el número

Proyecto: Juego de Adivinar el Número Objetivo Crear un juego interactivo en el que el usuario debe adivinar un número aleatorio entre 1 y 100. El juego brindará retroalimentación indicando si

read more
Introducción a Javascript

Introducción a Javascript

Test Código<!DOCTYPE html> <html lang="es"> <head> <meta charset="UTF-8"> <title>Introducción a JavaScript</title> <style> /* E

read more
Examen Práctico: Mi Página Personal

Examen Práctico: Mi Página Personal

Examen Práctico: Objetivo Crear una página web personal con diseño moderno en la que se muestre:Una cabecera fija con tu nombre y un menú de navegación interactivo. **Una sección "Sob

read more
Bases para la Elaboración del Reporte Breve del Proyecto

Bases para la Elaboración del Reporte Breve del Proyecto

📝 Bases para la Elaboración del Reporte Breve del ProyectoFormato: Documento Word (máximo 4 páginas)Entrega: En formato digital (PDF), cargar en el apartado de Archivos.

read more
Mascota virtual

Mascota virtual

🐾 Proyecto: Mascota Virtual en Escritorio con Python Este proyecto te guiará paso a paso para crear una mascota virtual que se mueva por tu pantalla de Windows y muestre mensajes motivadores c

read more
Mascota virtual

Mascota virtual

🐾 Proyecto: Mascota Virtual en Escritorio con Python Este proyecto te guiará paso a paso para crear una mascota virtual que se mueva por tu pantalla de Windows y muestre mensajes motivadores c

read more