Besplatan Uređivač Markdowna

Pišite i pregledajte Markdown u realnom vremenu. Podržava naslove, podebljano, kurziv, blokove koda, tabele i liste.

Radi offline nakon učitavanja
87 riječi · 529 znakova
Markdown
Pregled
<h2 class="text-2xl font-bold text-slate-900 dark:text-slate-50 mt-6 mb-2">Dobrodošli u Markdown editor</h2> <p class="my-3 text-slate-700 dark:text-slate-300 leading-relaxed">Pišite <strong>Markdown</strong> lijevo, uživo pregledajte desno.</p> <h3 class="text-xl font-bold text-slate-900 dark:text-slate-50 mt-6 mb-2">Funkcije</h3> <ul class="list-disc list-inside my-3 space-y-0.5 text-slate-700 dark:text-slate-300"><li class="my-0.5"><strong>Podebljano</strong>, <em>kurziv</em> i <del>precrtano</del></li><li class="my-0.5"><code class="bg-slate-100 dark:bg-slate-800 text-pink-600 dark:text-pink-400 rounded px-1 py-0.5 text-[0.85em] font-mono">Inline kod</code> i blokovi koda</li><li class="my-0.5"><a href="https://libratool.com" target="_blank" rel="noopener noreferrer" class="text-teal-600 dark:text-teal-400 underline underline-offset-2">Linkovi</a></li><li class="my-0.5">Liste, citati, tabele i još mnogo toga</li></ul> <h3 class="text-xl font-bold text-slate-900 dark:text-slate-50 mt-6 mb-2">Primjer koda</h3> <pre class="bg-slate-900 dark:bg-slate-950 text-slate-100 rounded-lg p-4 overflow-x-auto text-sm font-mono my-4"><code class="language-javascript">function greet(name) { return `Hello, ${name}!`; }</code></pre> <blockquote class="border-l-4 border-teal-400 dark:border-teal-600 pl-4 my-3 text-slate-600 dark:text-slate-400 italic">Markdown je stvorio John Gruber 2004. godine kako bi pisanje za web bilo lakše.</blockquote> <table class="my-4 w-full text-sm border-collapse"><thead><tr><th class="border border-slate-300 dark:border-slate-600 bg-slate-100 dark:bg-slate-800 px-3 py-2 text-left font-semibold">Funkcija</th><th class="border border-slate-300 dark:border-slate-600 bg-slate-100 dark:bg-slate-800 px-3 py-2 text-left font-semibold">Podržano</th></tr></thead><tbody><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">Naslovi</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">Liste</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">Tabele</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">Kod</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr></tbody></table>
Markdown podsjetnik
# Heading 1H1
**bold**Podebljano
*italic*Kurziv
`code`Kod u liniji
- itemNabrojana lista
1. itemNumerisana lista
> quoteCitat
[text](url)Link
![alt](url)Slika
---Razdjelnik

Kako radi

Pregled iscrtava ručno napisan Markdown raščlanjivač ugrađen direktno u alat — bez marked, bez remark, bez vanjske biblioteke. Tokenizuje izvor red-po-red u pregledniku, pretvarajući sintaksu u HTML koji se zatim prosljeđuje kroz čistača prije prikaza.

  1. 1
    Tokenizacija red-po-red
    Prilagođena funkcija renderMarkdown dijeli vaš izvor po novim redovima i prolazi kroz njih u jednom prolazu, podudarajući blokove koda u ogradama, naslove (H1–H6), citate, uređene i neuređene liste, GFM tabele (sa poravnanjem kolona), horizontalne linije, i paragrafe po prioritetnom redoslijedu.
  2. 2
    Proširivanje inline sintakse
    Svaki prikupljen red ili ćelija se zatim obrađuje pomoću inlineMarkdown, lanca zamjena regularnim izrazom koji obrađuje podebljano (** i __), kurziv (* i _), podebljano-kurziv (***), precrtano (~~), inline kod (), slike (![alt](url)), i veze ([tekst](url)) — slike se razrješavaju prije veza tako da se ! prefiks ne pogrešno konzumira.
  3. 3
    Čišćenje i blokiranje udaljenih resursa
    Sirovi HTML koji proizvodi iscrtavatelj se prosljeđuje kroz čistač (sanitize-html) da ukloni nesigurne oznake i atribute poput <script>, onerror rukovaoce, i javascript: hrefs. Drugi prolaz (neutralizeRemote) po defaultu zamjenjuje udaljene src vrijednosti slika čuvarima mjesta, sprječavajući da pregled tiho poziva vanjske servere prije nego što se izričito uključite.
  4. 4
    Izvoz kao .md ili samostalan .html
    Kopiranje ili preuzimanje Markdowna zapisuje sirovi izvorni tekst. Preuzimanje HTML-a omotava čist izlaz u samostalan dokument sa vlastitim inline stilskim listom — Tailwind klase rade samo unutar stranice, pa izvoz umjesto toga uključuje obična CSS pravila, čineći datoteku čitljivom bilo gdje.

Povezani alati

Često postavljana pitanja