Jak používat Značení ve vývoji webu

Feb 2, 2026
jak

Jako webové vývojáře a obsahové tvůrci, obecně trávíme spoustu času psaní textu, který je zabalen uvnitř Html. kód. Co kdybychom vám řekli, že je lepší způsob, jak to udělat s Markdown? Způsob, jakým jste se mohli zaměřit na psaní a ne kód?

Zmenšení je prostý text, Lightweight Markup jazyk vyvinutý v roce 2004 John Gruber a Aaron Swartz. Původně vytvořený pro psaní XHTML / HTML jednodušší přeměnou jednoduchých textových souborů do strukturálně platného HTML nebo XHTML, může být značení použito pro téměř jakýkoliv typ psaní: rukopisy, konzultace, poznámky, webový obsah a další.

Ačkoli relativně přímočarý, zkazování může být trochu zastrašující, když nejprve začnete. Ale jakmile se dostanete viset z toho, rychle si uvědomíte, kolik času strávil formátování vašeho kódu namísto zadání obsahu.

01. Vyberte editor pro markdown

Když pracujete s Markdown pro web, je důležité pochopit základní syntaxi a omezení, které můžete čelit. Než začnete, potřebujete nějaký typ editoru a tlumočníka pro vaše stránky. Střídavě můžete převést značení před publikováním.

You'll need some kind of editor to get started

Budete potřebovat nějaký druh editoru, abyste mohli začít

Existuje několik editorů, ze kterých si můžete vybrat. Byword. Je úžasné, protože nabízí širokou škálu možností vývozu, včetně HTML a PDF. Další velkou alternativou je Stohedit - Bezplatný editor online markdown. Samozřejmě, jakýkoli prostý textový editor bude fungovat.

Jetpack is handy for use with WordPress

Jetpack je praktický pro použití s ​​WordPress

Pokud neplánujete převést značení na HTML, můžete získat plugin (nebo interrupter) pro své stránky. Pro WordPress, Raketový batoh Má vynikající podporu pro značení, která umožňuje používat značení přímo uvnitř příspěvků a komentářů - pokud tuto možnost povolit.

Stejně jako jakýkoli značení jazyk má značka vlastní syntaxi. Poznámka: Existuje řada různých příchutí nebo odrůd značení. V tomto článku pokryjeme pouze společně sdílenou syntaxi.

02. Nastavte záhlaví

V HTML, existuje šest stylů nadpisů: H1. , h2. , h3. , H4 , h5. a H6 . Chcete-li tyto značení znovu vytvořit, použijte sérii hashtag symbolů ( # ) - Odpovídá číslu čísla - následuje textový text. Chcete-li například vytvořit & lt; h1 & gt; Tag, použijte jeden hashtag # ; pro A. & lt; h2 & gt; Tag, použijte dva hashtags ## ; a tak dále a tak dále.

Zvedací vstup: 

 # Položka 1
## Rubric 2.
### READING 3.
#### Nadpis 4.
##### Nadpis 5. \ t
###### Zadání 6

Výstup HTML:

03. Označte odstavce

Odstavce jsou reprezentovány & lt; p & gt; Tag v html. V značení jsou odděleny jedním nebo více prázdnými řádky. Stejně jako HTML, Whitespace je ignorován. Takže pokud přidáte 20 prázdných řádků, stále máte jen jeden odstavec.

Zvedací vstup: 

 Rychlá hnědá liška skočí přes líný pes.
Líný pes se nestará, protože je líný pes.

Výstup HTML: 

 & lt; p & gt; rychlá hnědá liška skočí přes líný pes. & Lt; / p & gt;
& lt; p & gt; líný pes se nestará, protože je líný pes. <115]
  

   04. Styl přestávky řádku
  

  

   Přestávky, které jsou reprezentovány v HTML s
   
    & lt; br & gt;
   
   Štítek, jsou přidány pomocí jediného přerušení řádku, se dvěma mezerami na konci předchozího řádku.
  

  

   
    Zvedací vstup:
   
  

  
 Rychlá hnědá liška
skočí přes líný pes. 

  

   
    Výstup HTML:
   
  

  
 & lt; p & gt; rychlá hnědá liška & lt, br & gt; skoky přes líný pes. & Lt; / p & gt; 

  

   05. Označte důraz
  

  

   Existují dva způsoby, jak přidělit důraz na váš text: kurzíva (
   
    & lt; em & gt;
   v html) nebo tučně (
   
    & lt; silný a gt;
   
   v html).
  

  

   V zmenšenosti, dosáhnete tohoto použití jednoho nebo dvou hvězdiček (
   
    *
   
   ). Můžete také použít podtržítka (_), ale držím se hvězdičkami, protože existují další příchutě značení, které používají podtržítko pro jiné věci.
  

  

   
    Zvedací vstup:
   
  

  
 italský text *
** Bold Text ** 

  

   
    Výstup HTML:
   
  

  
 & lt; em & gt; italský text & lt; / em & gt;
& lt; silný & gt; odvážný text & lt; / silný a gt; 

  

  

  

   Poznámka: Můžete také vytvářet tučně-kurzíva pomocí tří hvězdiček:
   
    *** Odvážný a kurzový text ***
   
   .
  

  

   06. Vytvořit horizontální pravidla
  

  

   Vytvořit horizontální pravidlo (nebo
   
    HR & GT;
   
   V HTML) použijte řadu tří nebo více pomlček (
   
    ----
   
   ), hvězdičky (hvězdičky (
   
    ***
   
   ) nebo rovné znaky (
   
    ===.
   
   ). Je to vaše volba, kterou dáváte přednost, ale jen se ujistěte, že patříte prázdný řádek nad a níže.
  

  

   
    Zvedací vstup:
   
  

  
 Učení něco nového je vždy spoustu legrace.

----

Jistě je! 

  

   
    Výstup HTML:
   
  

  
 & lt, p & gt; učení něco nového je vždy hodně legrace. & Lt; / p & gt;
HR & GT;
& lt, p & gt; to je jistě! <115]
  

   07. Přidat obrázky a odkazy
  

  

   V HTML je přidán obrázek pomocí
   
    & lt; img & gt;
   
   Štítek a odkazy jsou přidány pomocí
   
    & lt; a gt;
   
   štítek.
  

  

   V značení začínají obrázky vykřičníkem (
   
    Dokázal se!
   
   ), následované čtvercovými závorkami (
   
    []
   
   ) pro "alt text" a závorky (
   
    ()
   
   ) Pro cestu k obrázku. Můžete také zahrnout volitelný titul uvnitř dvojitých uvozovek (
   
    ""
   
   ).
  

  

   S odkazy je to téměř stejné, s výjimkou nevykřičního bodu.
  

  

   
    Zvedací vstup:
   
  

  
! [ALT Text] (/ cesta / do / image.jpg "volitelný titul")
[LINK TEXT] (http://example.com "volitelný titul") 

  

   Poznámka: Můžete také použít referenční odkazy a obrázky, ale to není zde pokryto.
  

  

   
    Výstup HTML:
   
  

  
 & lt; img src = "/ cesta / do / image.jpg" alt = "alt text" title = "volitelný titul" / gt;
& lt; a href = "http://example.com" title = "volitelný titul" & gt; odkaz text & lt; / a & gt; 

  

   08. Seznamy
  

  

   Existují dva typy seznamů v HTML: Objednáno (
   
    & lt; ol & gt;
   
   ) a nepoškozené (
   
    & lt; ul & gt;
   
   ). Pomocí značek, použijte čísla pro objednané seznamy a hvězdičky (
   
    *
   
   ) nebo pomlčky (
   
    -
   
   ) Pro nepohybované seznamy.
  

  

   
    Zvedací vstup:
   
  

  
 1. Položka 1.
2. Položka 2.
* První položka
* Druhá položka
- první položka
- Druhá položka 

  

   
    Výstup HTML:
   
  

  
 & lt; ol & gt;
& lt, li & gt; položka 1 & lt; / li & gt;
& lt, li & gt; položka 2 & lt; / li & gt;
& lt; / ol & gt;
& lt; ul & gt;
& lt, li & gt; první položka & lt; / li & gt;
Druhá položka & lt; / li & gt;
& lt; / ul & gt;
& lt; ul & gt;
& lt, li & gt; první položka & lt; / li & gt;
Druhá položka & lt; / li & gt;
& lt; / ul & gt; 

  

   09. Přidat inline kód a kódové bloky
  

  

   Pokud pracujete s kódem v HTML, můžete jej buď zahrnout jako inline prvek pomocí
   
    & lt; kód & gt;
   
   Štítky; nebo jako předem formátovaný textový blok pomocí
   
    & lt; pre & gt; 
   kombinace.
  

  

   V značení jsou tyto prvky vymezeny buď jeden backtick na každé straně (
   
    `
   
   ); nebo pomocí oploceného stylu, který obsahuje tři backticks nad a pod kódovým blokem (
   
    `` `
   
   ).
  

  

   
    Zvedací vstup:
   
  

  
 Proměnná `numberOfpoints" drží skóre hráče.
Pokud hráč.Wins {
NumberOfpoints + = 1
}


  

   
    Výstup HTML:
   
  

  
 Code & gt; číslováním bodů & lt; / kód & gt; Proměnná drží skóre hráče.
& lt; pre & gt; 

  

   10. Styl až bloky
  

  

   Bloky jsou přidány v HTML pomocí
   
    & lt, blockquote & gt;
   
   štítek. V značení použijte větší než symbol (
   
    & gt;
   
   ) Před řádkem.
  

  

   
    Zvedací vstup:
   
  

  
 & gt; To je můj blockquote.
& gt;
& gt; To je součástí stejného blokování.
& gt; Jedná se o nový blok. 

  

   
    Výstup HTML:
   
  

  
 & lt; blockquote & gt;
& lt, p & gt; tohle je můj blockquote. & lt; / p & gt;
& lt; br & gt;
P & gt; To je součást stejné blokování. & lt; / p & gt;
& lt; / blockquote & gt;
& lt; blockquote & gt;
& lt, p & gt; to je nový blok.
& lt; / blockquote & gt; 

  

   11. Vložit inline html
  

  
Existují časy, kdy potřebujete vytvořit HTML prvek, který není podporován;Můžete například potřebovat
   
    & lt; stůl & gt;
   
   nebo
   
    & lt, div a gt;
   
   štítek.
  

  

   Pokud tomu tak je, můžete mixovat Zmenšit a HTML, ale existují určitá omezení.Například, nemůžete zahrnout značení v rámci štítků HTML na úrovni bloku.
  

  

   
    Přečtěte si více:
   
  

  
    
   
  • 
    
     20 modulů node.js, které potřebujete vědět
    
   
    • 
   
  • 
    
     12 Odpovězené otázky běžného JavaScriptu
    
   
    • 
   
  • 
    
     9 nejlepších zdrojů pro učení HTML a CSS
    
   
    •

jak - Nejoblíbenější články

Jak používat Cloud Storage jako kreativní

jak Feb 2, 2026

(Image Credit: Jan Vašek z Pixabay) Proč potřebujete vědět, jak používat cloud ukládání? Well Cloud Skladov..

Přidejte digitální barvy na kresby tužky

jak Feb 2, 2026

Kliknutím na obrázek zobrazíte plnou velikost Jsem velký fanoušek tradičních méd..

Jak vytvořit progresivní webovou aplikaci

jak Feb 2, 2026

Mobilní nyní účtuje přes polovinu provozu webu a webové aplikace umožňují uživatelům dělat věci v prohlížeči, kte..

Připravte si desku pro malování ve 3 jednoduchých krocích

jak Feb 2, 2026

Budu sdílet nejrychleji Malířská technika Používám pro "gessoing" panel a dostat hladký povrch. Tento ..

Malování Sci-fi herní nastavení ve Photoshopu

jak Feb 2, 2026

Vždy jsem si myslel, že originalita se nachází někde mezi tím, co se vám líbí a co pozorujete. Mám rád míchání sci-..

Navrhněte citlivým místem s emisemi na bázi EM

jak Feb 2, 2026

Pravděpodobně jste slyšeli, že byste měli používat relativní jednotky pro velikost písma. To je dobré pravidlo pro přístupný web design; Pokud uživatel změní výchozí velikos..

Vytvořit malířské efekty v aplikaci Photoshop CC

jak Feb 2, 2026

Adobe vydala dva nové video tutoriály, které vám pomohou vzít si photoshop Kreativní mrak dovednosti na dal�..

Jak přidat data do návrhů náčrtu

jak Feb 2, 2026

Design obrazovky přišel v posledních několika letech dlouhou cestu. Heck, my jsme ani před několika lety neřekli "design o..

Kategorie