Markdown Cheat Sheet¶

Az oldalon használt markdown az alapokon kívül is ki van egészítve extra feature-ökkel, amikről lentebb tudsz tájékozódni.

Abbreviations¶

Ismeretlen szavakra ha ráviszed a kurzort, akkor megmutatja a jelentésüket. Mobilon egy kicsit bugos, de működik.

Note

példa kód

The HTML specification is maintained by the W3C.

*[HTML]: Hyper Text Markup Language
*[W3C]: World Wide Web Consortium

megjelenés

The HTML specification is maintained by the W3C.

Admonitions¶

Színes dobozokat tudsz létrehozni. Többféleképpen meg lehet adni egyet.

Kód¶

Cím nélkül¶

Cím nélkül

példa kód

!!! warning
    egy egy figyelmeztetés

megjelenés

Warning

valami

Címmel¶

Címmel

példa kód

!!! warning "Ez a cím"
    ez egy figyelmeztetés

megjelenés

Ez a cím

ez egy figyelmeztetés

Üres címmel¶

Üres címmel

példa kód

!!! warning ""
    ez egy figyelmeztetés

megjelenés

ez egy figyelmeztetés

Kinyitható¶

Kinyitható

példa kód

??? warning "Ez a cím"
    ez egy figyelmeztetés

megjelenés

Ez a cím

ez egy figyelmeztetés

Becsukható¶

Becsukható

példa kód

???+ warning "Ez a cím"
    ez egy figyelmeztetés

megjelenés

Ez a cím

ez egy figyelmeztetés

Szöveg végéhez igazítva¶

Warning

Egy sorba a szöveggel, a szöveg végén.

!!! warning inline end
    Egy sorba a szöveggel, a szöveg végén.

Szöveg elejéhez igazítva¶

Warning

Egy sorba a szöveggel, a szöveg végén.

!!! warning inline
    Egy sorba a szöveggel, a szöveg végén.

A szöveg végéhez, elejéhez igazítás mobilokon nem működik 😢.

Típusai¶

A fenti példakódokban a warning helyére írd be az itt lévő egyik bekeretezett szöveget, hogy megkapja a stílusát.

note: Note

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
abstract, summary, tldr: Abstract

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
info, todo: Info

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
tip, hint, important: Tip

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
success, check, done: Success

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
question, help, faq: Question

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
warning, caution, attention: Warning

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
failure, fail, missing: Failure

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
danger, error: Danger

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
bug: Bug

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
example: Example

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
quote, cite: Quote

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.

Buttons¶

Ha linkek helyett inkább menő gombokat szeretnél használni, akkor azt így teheted meg:

Kitöltetlen gomb

példa kód

[Subscribe to our mailing list](#){ .md-button }

megjelenés

Subscribe to our mailing list

Kitöltött gomb

példa kód

[Subscribe to our mailing list](#){ .md-button .md-button--primary }

megjelenés

Subscribe to our mailing list

Kitöltött gomb ikonnal

példa kód

[Submit :fontawesome-solid-paper-plane:](#){ .md-button .md-button--primary }

megjelenés

Submit

A (#)-ben a # helyére kell írnod a webcímet.

Code blocks¶

Forráskód szövegkiemeléssel¶

Ha forráskódot szeretnél megosztani szövegkiemeléssel.

Python kód szövegkiemeléssel

példa kód

```python
import tensorflow as tf
```

megjelenés

import tensorflow as tf

Forráskód sorszámozása¶

Python kód szövegkiemeléssel, sorszámmal

példa kód

``` python linenums="1"
def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
```

megjelenés

def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]

Forráskód adott sorának kiemelése¶

Python kód szövegkiemeléssel, 2. és 3. sor kiemelése

példa kód

``` python hl_lines="2 3"
def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
```

megjelenés

def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]

Szövegen belül kiemelés¶

Szövegen belül kiemelés

példa kód

The `#!python def bubble_sort(items)` function is used to generate a sequence of numbers.
The `def bubble_sort(items)` function is used to generate a sequence of numbers.

megjelenés

The def bubble_sort(items) function is used to generate a sequence of numbers.
The def bubble_sort(items) function is used to generate a sequence of numbers.

Billentyű gombok¶

Billentyű gombok kiemelése

példa kód

++ctrl+alt+del++

megjelenés

Ctrl+Alt+Del

Másik fájl tartalmának megjelenítése¶

Idk miért, de nem működik 😢

Másik fájl referenciaként

példa kód

```
--8<-- ".browserslistrc"
```

megjelenés

--8<-- ".browserslistrc"

Content tabs¶

Lapozható fülek készítése

példa kód

=== "C"
    ``` c
    #include <stdio.h>

    int main(void) {
    printf("Hello world!\n");
    return 0;
    }
    ```
=== "C++"
    ``` c++
    #include <iostream>

    int main(void) {
    std::cout << "Hello world!" << std::endl;
    return 0;
    }
    ```

megjelenés

CC++

#include <stdio.h>

int main(void) {
printf("Hello world!\n");
return 0;
}

#include <iostream>

int main(void) {
std::cout << "Hello world!" << std::endl;
return 0;
}

Data tables¶

Táblázat

példa kód

| Method      | Description                          |
| ----------- | ------------------------------------ |
| `GET`       | :material-check:     Fetch resource  |
| `PUT`       | :material-check-all: Update resource |
| `DELETE`    | :material-close:     Delete resource |

megjelenés

Method	Description
`GET`	Fetch resource
`PUT`	Update resource
`DELETE`	Delete resource

Táblázat igazítása¶

Táblázat igazítás

BalKözépJobb

példa kód

| Method      | Description                          |
| :---------- | :----------------------------------- |
| `GET`       | :material-check:     Fetch resource  |
| `PUT`       | :material-check-all: Update resource |
| `DELETE`    | :material-close:     Delete resource |

megjelenés

Method	Description
`GET`	Fetch resource
`PUT`	Update resource
`DELETE`	Delete resource

példa kód

| Method      | Description                          |
| :---------: | :----------------------------------: |
| `GET`       | :material-check:     Fetch resource  |
| `PUT`       | :material-check-all: Update resource |
| `DELETE`    | :material-close:     Delete resource |

megjelenés

Method	Description
`GET`	Fetch resource
`PUT`	Update resource
`DELETE`	Delete resource

példa kód

| Method      | Description                          |
| ----------: | -----------------------------------: |
| `GET`       | :material-check:     Fetch resource  |
| `PUT`       | :material-check-all: Update resource |
| `DELETE`    | :material-close:     Delete resource |

megjelenés

Method	Description
`GET`	Fetch resource
`PUT`	Update resource
`DELETE`	Delete resource

A táblázatok első sorára kattintva, az adott oszlop szerint lehet rendezni a sorokat.

Diagram¶

Diagram készítése

példa kód

``` mermaid
graph LR
A[Start] --> B{Error?};
B -->|Yes| C[Hmm...];
C --> D[Debug];
D --> B;
B ---->|No| E[Yay!];
```

megjelenés

graph LR
A[Start] --> B{Error?};
B -->|Yes| C[Hmm...];
C --> D[Debug];
D --> B;
B ---->|No| E[Yay!];

Footnotes¶

Hivatkozás

példa kód

Ilyen formában add meg a szöveget:

Lorem ipsum[^1] dolor sit amet, consectetur adipiscing elit.[^2]

Ezt pedig bárhol megadhatod a dokumentumban, de mindig a dokumentum aljában lesz megtalálható:

[^1]: Lorem ipsum dolor sit amet, consectetur adipiscing elit.
[^2]:
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod
    nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor
    massa, nec semper lorem quam in massa.

megjelenés

Lorem ipsum¹ dolor sit amet, consectetur adipiscing elit.²

Formatting¶

Critic¶

Szöveg formázás

MegjelenésKód

Here is some {--incorrect--} Markdown. I am adding this{++ here++}. Here is some more {--text that I am removing--}text. And here is even more {++text that I am ++}adding.{~~

~> ~~}Paragraph was deleted and replaced with some spaces.{~~ ~>

~~}Spaces were removed and a paragraph was added.

And here is a comment on {some text}{>>This works quite well. I just wanted to comment on it.<<}. Substitutions {~~is~>are~~} great!

General block handling.

{--

test remove
test remove
test remove
- test remove
test remove

--}

{++

test add
test add
test add
- test add
test add

++}

Here is some {--*incorrect*--} Markdown.  I am adding this{++ here++}.  Here is some more {--text
that I am removing--}text.  And here is even more {++text that I 
am ++}adding.{~~

~>  ~~}Paragraph was deleted and replaced with some spaces.{~~  ~>

~~}Spaces were removed and a paragraph was added.

And here is a comment on {==some
text==}{>>This works quite well. I just wanted to comment on it.<<}. Substitutions {~~is~>are~~} great!

General block handling.

{--

* test remove
* test remove
* test remove
    * test remove
* test remove

--}

{++

* test add
* test add
* test add
    * test add
* test add

++}

BetterEm¶

Szöveg formázása egyszerűen, markdown stílusban:

Formázás

Kód

*Dőlt betű*

**Félkövér**

***Dőlt félkövér***

Megjelenés

Dőlt betű

Félkövér

Dőlt félkövér

Caret, Mark & Tilde¶

Caret¶

Aláhúzás és felső indexbe tevés:

Vegyük észre, hogy a szóközt felső index esetében escape-elni kell a jellel.

Kód

^^Aláhúzott^^

Fels^ő\ indexbe^

Megjelenés

Aláhúzott

Fel^{ső indexbe}

Mark¶

Szöveg kiemelése:

Kód

==Ez ki lesz emelve==, ez meg már nem 😢

Megjelenés

Ez ki lesz emelve, ez meg már nem 😢

Tilde¶

Áthúzás és alsó indexbe tevés:

Vegyük észre, hogy a szóközt alsó index esetében escape-elni kell a jellel.

Kód

~~Áthúzott~~

Al~só\ indexbe~

Megjelenés

~~Áthúzott~~

Al_{só indexbe}

SmartSymbols¶

szövegből speciális karaktert készít

Markdown	Result
`(tm)`	™
`(c)`	©
`(r)`	®
`c/o`	℅
`+/-`	±
`-->`	→
`<--`	←
`<-->`	↔
`=/=`	≠
`1/4, etc.`	¼, etc.
`1st 2nd etc.`	1^st 2^nd etc.

Icons + Emojis¶

Egyszerű szövegből emojit készít úgy, hogy .svg képet illeszt be a helyére.

emoji használata

Kód

:smile:

- :fontawesome-brands-medium:{ .medium } – Medium
- :fontawesome-brands-twitter:{ .twitter } – Twitter
- :fontawesome-brands-facebook:{ .facebook } – Facebook

Megjelenés

– Medium
– Twitter
– Facebook

Images¶

Kép elhelyezése¶

A Placeholder helyére lehet írni, hogy milyen szöveg jelenjen meg, ha nem tud betöltődni a kép.

LeftRightCaptionLazy-loading

Example:

![Placeholder](https://dummyimage.com/600x400/eee/aaa){ align=left }

Result:

Placeholder

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.

Example:

![Placeholder](https://dummyimage.com/600x400/eee/aaa){ align=right }

Result:

Placeholder

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.

Example:

<figure>
    <img src="https://dummyimage.com/600x400/eee/aaa" width="300" />
    <figcaption>Image caption</figcaption>
</figure>

Result:

Example:

![Placeholder](https://dummyimage.com/600x400/eee/aaa){ loading=lazy }

Akkor fog betöltődni a kép, amikor a viewport-ba kerül. Pl. ha nem görget le az oldal aljáig a felhasználó, akkor minek töltődjön be a kép?

Result:

Placeholder

Lists¶

Lista készítése. Lista listában csak 4 space-szel beljebb lehet készíteni.

Lista készítés

Számozatlan listaSzámozott listaDefiníciós listaFeladat lista

Ilyen listát a -, * vagy + jelekkel lehet készíteni.

Kód

- alma
- banán
    - banánfa
- citrom

Megjelenés

alma
banán
- banánfa
citrom

Egy szám és az azt követő ponttal lehet ilyen listát készíteni.

Kód

1. alma
2. banán
    1. banánfa
4. citrom

Megjelenés

alma
banán
1. banánfa
citrom

: után soronként beljebb kezdve

Kód

`Lorem ipsum dolor sit amet`
:   Sed sagittis eleifend rutrum. Donec vitae suscipit est. Nullam tempus
    tellus non sem sollicitudin, quis rutrum leo facilisis.

`Cras arcu libero`
:   Aliquam metus eros, pretium sed nulla venenatis, faucibus auctor ex. Proin
    ut eros sed sapien ullamcorper consequat. Nunc ligula ante.

    Duis mollis est eget nibh volutpat, fermentum aliquet dui mollis.
    Nam vulputate tincidunt fringilla.
    Nullam dignissim ultrices urna non auctor.

Megjelenés

Lorem ipsum dolor sit amet

Sed sagittis eleifend rutrum. Donec vitae suscipit est. Nullam tempus tellus non sem sollicitudin, quis rutrum leo facilisis.

Cras arcu libero

Aliquam metus eros, pretium sed nulla venenatis, faucibus auctor ex. Proin ut eros sed sapien ullamcorper consequat. Nunc ligula ante.

Duis mollis est eget nibh volutpat, fermentum aliquet dui mollis. Nam vulputate tincidunt fringilla. Nullam dignissim ultrices urna non auctor.

[ ]-ban egy szóköz a teljesítetlent, a [X] a teljesített feladatot jelöli.

Egy bekapcsolt featue miatt kattintásra ki és be lehet kapcsolni őket, de ez nem perzisztens, csak látvány szempontjából van jelentősége.

Kód

- [x] Lorem ipsum dolor sit amet, consectetur adipiscing elit
- [ ] Vestibulum convallis sit amet nisi a tincidunt
    - [x] In hac habitasse platea dictumst
    - [x] In scelerisque nibh non dolor mollis congue sed et metus
    - [ ] Praesent sed risus massa
- [ ] Aenean pretium efficitur erat, donec pharetra, ligula non scelerisque

Megjelenés

Lorem ipsum dolor sit amet, consectetur adipiscing elit
Vestibulum convallis sit amet nisi a tincidunt
- In hac habitasse platea dictumst
- In scelerisque nibh non dolor mollis congue sed et metus
- Praesent sed risus massa
Aenean pretium efficitur erat, donec pharetra, ligula non scelerisque

MathJax¶

Matekos képlet írás

Kód

Block:

$$
\operatorname{ker} f=\{g\in G:f(g)=e_{H}\}{\mbox{.}}
$$

Inline:
The homomorphism $f$ is injective if and only if its kernel is only the 
singleton set $e_G$, because otherwise $\exists a,b\in G$ with $a\neq b$ such 
that $f(a)=f(b)$.

Megjelenés

Block:

\[ \operatorname{ker} f=\{g\in G:f(g)=e_{H}\}{\mbox{.}} \]

Inline:

The homomorphism \(f\) is injective if and only if its kernel is only the singleton set \(e_G\), because otherwise \(\exists a,b\in G\) with \(a\neq b\) such that \(f(a)=f(b)\).

Meta tags¶

Egy adott markdown dokumentumnak lehet ezen keresztül egy általad választott nevet és leírást adni. A markdown dokumentumnak a tetejébe kell hogy kerüljön a --- közötti rész, hogy érvényesüljön.

---
title: Lorem ipsum dolor sit amet
description: Nullam urna elit, malesuada eget finibus ut, ac tortor.
author: Radeczki Gergő István
date: June 12, 2021
---

# Főcím
...

Variables¶

Vannak változók, amiket include-olni lehet, felülírni stb.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. ↩
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa. ↩