InícioSobre mim
EnglishTwitterGitHub
Djalma Júnior

Djalma Júnior

Markdown - Referência

Sumário

Linha horizontal §

[Marcação]

---

[Resultado]

Substituições Tipográficas §

[Marcação]

(c) (C) (r) (R) (tm) (TM) (p) (P) +-
teste.. teste... teste..... teste?..... teste!....
!!!!!! ???? ,, -- ---
"Aspas duplas" e 'aspas simples'

[Resultado]

© © ® ® ™ ™ § § ±
teste… teste… teste… teste?.. teste!..
!!! ??? , – —
“Aspas duplas” e ‘aspas simples’

Ênfase §

[Marcação]

**Texto em negrito**
__Texto em negrito__
*Texto em itálico*
_Texto em itálico_
~~Strikethrough~~

[Resultado]

Texto em negrito
Texto em negrito
Texto em itálico
Texto em itálico
Strikethrough

Citações §

[Marcação]

> Citações podem ser aninhadas...
>
>> Usando sinais de "maior que" adicionais adjacentes...
>>
> > > Mesmo usando espaços entre eles.

[Resultado]

Citações podem ser aninhadas…

Usando sinais de “maior que” adicionais adjacentes…

Mesmo usando espaços entre eles.

Listas §

Não ordenada

[Marcação]

- Crie uma lista iniciando uma linha com `+`, `-`, ou `*`
- Sub-listas são criadas identando com 2 espaços:
  - Diferentes marcadores forçam o início de uma nova lista
    - Ac tristique libero volutpat at
    * Facilisis in pretium nisl aliquet
    + Nulla volutpat aliquam velit

* Simples...

+ Assim!

[Resultado]

  • Crie uma lista iniciando uma linha com +, -, ou *
  • Sub-listas são criadas identando com 2 espaços:
    • Diferentes marcadores forçam o início de uma nova lista
      • Ac tristique libero volutpat at
      • Facilisis in pretium nisl aliquet
      • Nulla volutpat aliquam velit
  • Simples…
  • Assim!

Ordenada

[Marcação]

1. Lorem ipsum dolor sit amet
2. Consectetur adipiscing elit
3. Integer molestie lorem at massa

1) Você pode usar número sequenciais...
1) Ou manter todos os números como `1.`

[Resultado]

  1. Lorem ipsum dolor sit amet
  2. Consectetur adipiscing elit
  3. Integer molestie lorem at massa
  1. Você pode usar número sequenciais…
  2. Ou manter todos os números como 1.

Iniciando a numeração:

[Marcação]

57. foo
1. bar

[Resultado]

  1. foo
  2. bar

Lista de tarefas (via markdown-it-todo — veja a seção Plugins abaixo)

[Marcação]

- [ ] Item da lista
- [x] Fazer compras

[Resultado]

  • Item da lista
  • Fazer compras

Código §

Código em linha

[Marcação]

Texto e `código` juntos...

[Resultado]

Texto e código juntos…

Código indentado

[Marcação]

    // Conteúdo...
    linha de código 1
    linha de código 2
    linha de código 3

[Resultado]

// Conteúdo...
linha de código 1
linha de código 2
linha de código 3

Código com marcação

[Marcação]

    ```
    Texto de exemplo...
    ```

[Resultado]

    Texto de exemplo...

Destaque de sintaxe (via markdown-it-highlightjs — veja a seção de Plugins abaixo)

[Marcação]

    ```js
    var foo = function (bar) {
      return bar++;
    };

    console.log(foo(5));
    ```

[Resultado]

var foo = function (bar) {
  return bar++;
};

console.log(foo(5));

Tabelas §

[Marcação]

| Valor  | Descrição                                      |
| ------ | ---------------------------------------------- |
| data   | dados que serão passados ​​para os modelos.      |
| engine | mecanismo a ser usado para processar modelos.  |
| ext    | extensão a ser usada para arquivos de destino. |

[Resultado]

Valor Descrição
data dados que serão passados ​​para os modelos.
engine mecanismo a ser usado para processar modelos.
ext extensão a ser usada para arquivos de destino.

Colunas alinhadas à direita

[Marcação]

| Valor  |                                      Descrição |
| -----: | ---------------------------------------------: |
|   data |    dados que serão passados ​​para os modelos.   |
| engine |  mecanismo a ser usado para processar modelos. |
|    ext | extensão a ser usada para arquivos de destino. |

[Resultado]

Valor Descrição
data dados que serão passados ​​para os modelos.
engine mecanismo a ser usado para processar modelos.
ext extensão a ser usada para arquivos de destino.

Conversão de caracteres de pontuação ASCII em elementos HTML de forma “inteligente”. Exemplo:

[Marcação]

|           | ASCII                           | HTML                          |
| --------- | ------------------------------- | ----------------------------- |
| Apóstrofo | `'Isn't this fun?'`             | 'Isn't this fun?'             |
| Aspas     | `"Isn't this fun?"`             | "Isn't this fun?"             |
| Traços    | `-- is en-dash, --- is em-dash` | -- is en-dash, --- is em-dash |

[Resultado]

ASCII HTML
Apóstrofo 'Isn't this fun?' ‘Isn’t this fun?’
Aspas "Isn't this fun?" “Isn’t this fun?”
Traços -- is en-dash, --- is em-dash – is en-dash, — is em-dash

[Marcação]

[link](http://dev.nodeca.com)
[link com título](http://nodeca.github.io/pica/demo/ "Título!")
Link convertido automaticamente https://github.com/nodeca/pica (via linkify do [markdown-it](https://github.com/markdown-it/markdown-it))

[Resultado]

link
link com título
Link convertido automaticamente https://github.com/nodeca/pica (via linkify do markdown-it)

Imagens §

As imagens também têm uma sintaxe semelhante aos links:

[Marcação]

![Minion](https://octodex.github.com/images/minion.png =120x130)

![Stormtroopocat](https://octodex.github.com/images/stormtroopocat.jpg "The Stormtroopocat" =125x)

[Resultado]

Minion

Stormtroopocat

Plugins §

Este blog usa os seguintes plugins do markdown-it:

Você pode encontrar mais em markdown-it-plugin.

Emojis §

Todos os emoticons suportados pelo github usando markdown-it-emoji

[Marcação]

> Marcação clássica: :wink: :crush: :cry: :tear: :laughing: :yum:
> Atalhos (emoticons): :-) :-( 8-) ;)

[Resultado]

Marcação clássica: 😉 :crush: 😢 :tear: 😆 😋
Atalhos (emoticons): 😃 😦 😎 😉

Subscrito / Sobrescrito §

Subscrito e sobrescrito com base na definição do pandoc via markdown-it-sub / markdown-it-sup.

[Marcação]

19^th^
H~2~O

[Resultado]

19th
H2O

Marcações §

Suportado via markdown-it-mark.

[Marcação]

==Marked text==

[Resultado]

Marked text

Notas de Rodapé §

Suportado via markdown-it-footnote.

[Marcação]

Nota de rodapé 1[^first].

Nota de rodapé 2[^second].

Nota de rodapé 3[^3].

Nota de rodapé embutida^[Texto da nota de rodapé embutida].

Referência de nota de rodapé duplicada[^second].

[^first]: Nota de rodapé **pode ter marcação**
e múltiplos parágrafos.

[^second]: Nota de rodapé.
[^3]: Nota de rodapé com label numerado

[Resultado]

Nota de rodapé 1[1].

Nota de rodapé 2[2].

Nota de rodapé 3[3].

Nota de rodapé embutida[4].

Referência de nota de rodapé duplicada[2:1].

Listas de definições §

Suportado via markdown-it-deflist.

[Marcação]

Termo 1

: Definição 1
com continuação "preguiçosa".

Termo 2 com _marcação embutida_

: Definição 2

        { código dentro da definição 2 }

    Terceiro parágrafo da definição 2.

Termo 3
~ Definição 3

Termo 4
~ Definição 4a
~ Definição 4b

[Resultado]

Termo 1

Definição 1
com continuação “preguiçosa”.

Termo 2 com marcação embutida

Definição 2

  { código dentro da definição 2 }

Terceiro parágrafo da definição 2.

Termo 3

Definição 3

Termo 4

Definição 4a

Definição 4b

Sumário (TOC) §

Suportado via markdown-it-toc-done-right

[Marcação]

[toc]

[Resultado]

Veja o sumário desta página.

KaTeX §

Expressões matemáticas do LaTeX usando KaTeX:

[Marcação]

A _Função Gamma_ satisfaz $\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N$ através da integral de Euler

$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$

[Resultado]

The Gamma function satisfying Γ(n)=(n−1)!∀n∈N\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N is via the Euler integral

Γ(z)=∫0∞tz−1e−tdt.\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.

Você pode encontrar mais informações sobre expressões matemáticas do LaTeX aqui.

Diagramas §

Diagramas UML usando Mermaid.

[Marcação]

    ```mermaid
    sequenceDiagram
    Alice ->> Bob: Oi Bob, como vai você?
    Bob-->>John: E você, John?
    Bob--x Alice: Estou bem, obrigado!
    Bob-x John: Estou bem, obrigado!
    Note right of John: Bob pensa tanto<br/>tanto, tanto<br/>que o texto<br/>não coube numa linha.

    Bob-->Alice: Conferindo com John...
    Alice->John: Sim... John, como vai você?
    ```

    <br><br>

    ```mermaid
    graph LR
    A[Square Rect] -- Link text --> B((Circle))
    A --> C(Round Rect)
    B --> D{Rhombus}
    C --> D
    ```

[Resultado]

sequenceDiagram Alice ->> Bob: Oi Bob, como vai você? Bob-->>John: E você, John? Bob--x Alice: Estou bem, obrigado! Bob-x John: Estou bem, obrigado! Note right of John: Bob pensa tanto
tanto, tanto
que o texto
não coube na linha. Bob-->Alice: Conferindo com John... Alice->John: Sim... John, como vai você?



graph LR A[Square Rect] -- Link text --> B((Circle)) A --> C(Round Rect) B --> D{Rhombus} C --> D

  1. Nota de rodapé pode ter marcação
    e múltiplos parágrafos. ↩︎

  2. Nota de rodapé. ↩︎ ↩︎

  3. Nota de rodapé com label numerado ↩︎

  4. Texto da nota de rodapé embutida ↩︎

← Voltar