HTML:ssä meidän on lisättävä paljon tageja ja tyyli lisätään myös HTML:ään muotoilua varten. Voimme tehdä samat tehtävät HTML:ssä, jotka voimme myös tehdä Markdownilla. Voimme muuntaa Markdown-tiedoston HTML-tiedostoksi helposti käyttämällä joitain komentoja. Selitämme, kuinka Markdown muunnetaan HTML:ksi täällä. Muunnamme myös Markdownin HTML:ksi ja annamme yksityiskohtaisen kuvauksen tästä käsitteestä tässä oppaassa. Nyt muunnamme Markdown-tiedoston HTML-tiedostoksi. Lisäksi näytämme ja selitämme jokaisen vaiheen, jota meidän on noudatettava muuntaaksemme Markdown-tiedoston HTML-tiedostoksi Visual Studio Codessa.
Esimerkki 1:
Käytämme tässä Visual Studio Codea. Näytämme kuinka muunnamme Markdown-tiedoston HTML-tiedostoksi Visual Studio Codessa. Tätä varten meillä on oltava Markdown-tiedosto luotu tässä Visual Studio Codessa. Täällä luomamme tiedoston nimi on 'myabcfile.md'. Tähän tiedostoon lisäämme otsikon käyttämällä #-tunnistetta. Sitten lisäämme tämän otsikon alle tekstin, joka on yksinkertainen teksti tai kappale. Nyt lisäämme myös toisen rivin, joka on lihavoitu, koska lisäämme kaksi tähteä tämän rivin alkuun ja kaksi tähteä tämän rivin loppuun. Joten tämä rivi näkyy lihavoituna tässä. Tämän jälkeen kirjoitamme sanan 'luettelo' kursivoituksi. Teemme tämän sanan kursiivilla kahdella alaviivalla. Yksi alaviiva lisätään sanan alkuun ja yksi alaviiva lisätään sanan loppuun. Seuraavassa kuvassa luomme järjestetyn listan sijoittamalla numeron ja laittamalla pisteen numeron perään. Nyt tallennamme tämän tiedoston. Näytämme myös, kuinka tämä tiedosto näkyy esikatseluikkunassa.
Näytämme vain Markdown-koodin tulosteen esikatseluikkunassa. Nyt muunnamme tämän Markdownin HTML:ksi. Siirry eteenpäin ja katso seuraavasta kuvasta, kuinka tämä Markdown-tiedosto muunnetaan HTML-tiedostoksi:
Avaa pääte napsauttamalla päätettä tehtäväpalkissa, joka on tämän Visual Studio Coden yläosassa. Kun tämä pääte avataan, kirjoita 'code –install-extension yzhang.markdown-all-in-one' -komento, joka näkyy myös seuraavassa. Kun olet kirjoittanut tämän komennon Visual Studio Coden terminaaliin, painamme Enter-näppäintä. Tämän komennon onnistuneen kääntämisen jälkeen siirrymme eteenpäin. Tämä komento auttaa asentamaan tämän tässä mainitun laajennuksen.
Kun edellinen laajennus on asennettu onnistuneesti, avaamme 'Komentopaletin' tässä Visual Studio Codessa. Tämä komentopaletti avataan yksinkertaisesti painamalla 'CTRL+SHIFT+P' -näppäimiä. Tämän jälkeen pudotusvalikko avautuu tämän Visual Studio Code -sovelluksen yläosaan. Täällä kirjoitamme vain 'Markdown' ja sitten monet komennot ilmestyvät sinne. Valitsemme 'Markdown All in One: Tulosta nykyinen asiakirja HTML-muotoon' tässä seuraavan kuvan mukaisesti. Täällä valitsemme tämän komennon painamalla 'CTRL+SHIFT+P'. Nyt tämä Markdown-tiedosto muunnetaan HTML-tiedostoksi tämän komennon avulla, jonka valitsimme täällä.
Molemmat tiedostot näkyvät tässä. Muunnamme tämän 'myabcfile.md' -tiedoston 'myabcfile.html' -tiedostoksi. Markdown sekä HTML-tiedosto näkyvät seuraavassa kuvassa. Tämä HTML-tiedosto sisältää kaikki tiedot, jotka olemme lisänneet Markdown-tiedostoon. Mutta ainoa ero on, että HTML-tiedosto sisältää eri tunnisteet ja tyylit, mutta Markdown-tiedosto ei sisällä paljon tageja.
HTML-tiedosto näkyy myös seuraavassa kuvassa. Voit huomioida ',
,