Markdown ťahák
Markdown je sada dohôd, ako písať formátovaný text v obyčajnom súbore, a jeho čaro je v tom, že zdroj zostáva čitateľný aj vtedy, keď ho nič nevykreslí. Syntax nižšie je zoradená podľa toho, čo chcete dosiahnuť, a každý riadok ukazuje HTML, ktoré z nej naozaj vznikne.
Tie HTML úryvky nie sú napísané ručne. Každý je skutočný výstup konvertora na tejto stránke a testy ich pri každom builde porovnávajú s tabuľkou — keby si riadok a nástroj prestali odpovedať, build padne namiesto toho, aby vás stránka zavádzala.
Dialekt je CommonMark plus tie rozšírenia GitHubu, ktoré sú dnes bežné: tabuľky, zaškrtávacie zoznamy a preškrtnutie. Poznámky pod čiarou a definičné zoznamy tu zámerne nie sú — dokumentovať syntax, ktorá potom v nástroji o jedno kliknutie vedľa nič neurobí, je horšie než ju vynechať.
Zvýraznenie a inline kód
9Inline syntax funguje rovnako v odsekoch, nadpisoch, položkách zoznamu aj v bunkách tabuľky.
| Syntax | Čo robí | Vzniknuté HTML |
|---|---|---|
| *italic* | Kurzíva | <p><em>italic</em></p> |
| _italic_ | Kurzíva, alternatívna podobaVnútri slova sa ignoruje, takže snake_case prežije. | <p><em>italic</em></p> |
| **bold** | Tučné | <p><strong>bold</strong></p> |
| __bold__ | Tučné, alternatívna podoba | <p><strong>bold</strong></p> |
| ***both*** | Tučné a kurzíva naraz | <p><em><strong>both</strong></em></p> |
| ~~gone~~ | Preškrtnuté | <p><del>gone</del></p> |
| `code` | Inline kód — nič vnútri sa neinterpretuje | <p><code>code</code></p> |
| ``a ` b`` | Inline kód obsahujúci spätný apostrofZvonku použite viac apostrofov než je vnútri. | <p><code>a ` b</code></p> |
| \*not italic\* | Doslovná hviezdička namiesto zvýraznenia | <p>*not italic*</p> |
Nadpisy
7Používajte podobu s mriežkami; podčiarknutá siaha len na dve úrovne.
| Syntax | Čo robí | Vzniknuté HTML |
|---|---|---|
| # Heading | Nadpis 1. úrovne | <h1>Heading</h1> |
| ## Heading | Nadpis 2. úrovne | <h2>Heading</h2> |
| ### Heading | Nadpis 3. úrovne | <h3>Heading</h3> |
| ###### Heading | Nadpis 6. úrovne — najhlbší, aký existuje | <h6>Heading</h6> |
| Heading ======= | Nadpis 1. úrovne, podčiarknutá podoba | <h1>Heading</h1> |
| Heading ------- | Nadpis 2. úrovne, podčiarknutá podoba | <h2>Heading</h2> |
| ## Heading ## | Mriežky na konci sú ozdoba a zahodia saIch počet vpravo sa ignoruje; úroveň určuje len počet vľavo. | <h2>Heading</h2> |
Zoznamy
7Vnorenie sa robí odsadením o dve medzery. Prázdny riadok medzi položkami z každej urobí odsek.
| Syntax | Čo robí | Vzniknuté HTML |
|---|---|---|
| - one - two | Zoznam s odrážkami | <ul> <li>one</li> <li>two</li> </ul> |
| * one * two | Zoznam s odrážkami, alternatívna značka | <ul> <li>one</li> <li>two</li> </ul> |
| 1. one 2. two | Číslovaný zoznam | <ol> <li>one</li> <li>two</li> </ol> |
| 1. one 1. two | Tiež číslovaný zoznam, prečísluje sa pri vykresleníPoužije sa len prvé číslo; ostatné môžu byť všetky 1. | <ol> <li>one</li> <li>two</li> </ol> |
| - one - nested | Vnorený zoznam — potomka odsaďte o dve medzery | <ul> <li>one <ul> <li>nested</li> </ul></li> </ul> |
| - [ ] todo | Nezaškrtnutá položka zoznamu úloh | <ul> <li><input type="checkbox" disabled /> todo</li> </ul> |
| - [x] done | Zaškrtnutá položka zoznamu úloh | <ul> <li><input type="checkbox" checked disabled /> done</li> </ul> |
Odkazy a obrázky
6| Syntax | Čo robí | Vzniknuté HTML |
|---|---|---|
| [text](https://a.co) | Odkaz | <p><a href="https://a.co">text</a></p> |
| [text](https://a.co "Tip") | Odkaz s bublinovým popisom | <p><a href="https://a.co" title="Tip">text</a></p> |
| <https://a.co> | Samotná URL zmenená na odkaz | <p><a href="https://a.co">https://a.co</a></p> |
| [mail](mailto:a@b.co) | Odkaz na e-mail | <p><a href="mailto:a@b.co">mail</a></p> |
|  | Obrázok s alternatívnym textom | <p><img src="cat.png" alt="alt" /></p> |
| [x](javascript:alert(1)) | Nebezpečná schéma — odkaz sa zahodí, text zostaneURL javascript:, data: a vbscript: prídu o href. | <p>x</p> |
Blokové prvky
9Každý z nich musí začínať na začiatku riadku.
| Syntax | Čo robí | Vzniknuté HTML |
|---|---|---|
| > quoted | Citovaný blok | <blockquote> <p>quoted</p> </blockquote> |
| > > deeper | Vnorený citovaný blok | <blockquote> <blockquote> <p>deeper</p> </blockquote> </blockquote> |
| ``` code ``` | Blok kódu ohradený apostrofmi | <pre><code>code </code></pre> |
| ```js let a = 1; ``` | Blok kódu s triedou jazyka pre zvýrazňovanie | <pre><code class="language-js">let a = 1; </code></pre> |
| code | Blok kódu odsadením o štyri medzery | <pre><code>code </code></pre> |
| --- | Vodorovná linka | <hr /> |
| *** | Vodorovná linka, alternatívna podoba | <hr /> |
| one two | Zlom riadku vnútri odsekuDve medzery na konci. Vo väčšine editorov neviditeľné, preto to tak často nevyjde. | <p>one<br /> two</p> |
| one two | Prázdny riadok oddeľuje odseky | <p>one</p> <p>two</p> |
Tabuľky
4Tabuľku robí tabuľkou oddeľovací riadok. Zarovnanie určujú dvojbodky v ňom.
| Syntax | Čo robí | Vzniknuté HTML |
|---|---|---|
| | a | b | | - | - | | 1 | 2 | | Tabuľka — hlavička, oddeľovací riadok, potom telo | |
| | :--- | | Zarovnanie stĺpca vľavo, v oddeľovacom riadku | |
| | :---: | | Zarovnanie stĺpca na stred | |
| | ---: | | Zarovnanie stĺpca vpravo |