1Markdown är ett lättviktigt "markup"-språk som används för att formatera text. Det används ofta för att skriva dokumentation, blogginlägg och rapporter i ren text som sedan kan konverteras till HTML, PDF eller andra format.
  2
  3Denna kurshemsida är mestadels skriven i Markdown som sedan _renderas_ till HTML för visning i webbläsaren. I VS Code kan man författa Markdown med syntax highlight (som t.ex. visar viss formatering direkt i redigeringsfönstret). Det finns också en Markdown Preview inbyggd i VS Code, samt ett antal extensions för att förbättra Markdown-redigering och förhandsgranskning. Speciellt kan jag rekommendera `markdownlint`. Andra populära tillägg är `Markdown Preview Enhanced` och `Markdown All in One`.
  4
  5## Grundläggande Markdown-syntax
  6
  7### Rubriker
  8
  9Använd `#` för rubriker. Fler `#` ger mindre rubriker. T.ex. `# Titel`, `## Kapitel`, `### Avsnitt`, `#### Underavsnitt`.
 10
 11### Styckesindelning
 12
 13I Markdown skapas nya stycken genom att lämna en tom rad mellan textblock. T.ex.:
 14
 15```markdown
 16Detta är första stycket.
 17Vi kan lägga flera meningar i samma stycke men på separata rader utan att detta skapar ett nytt stycke.
 18När detta rendreras kommer det alltså inte att bli några radbrytningar.
 19
 20Detta är andra stycket. Här har vi låtit nästa mening fortsätta på samma rad för att visa att det blir likadant.
 21```
 22
 23Ovanstående kommer att rendreras som:
 24
 25Detta är första stycket.
 26Vi kan lägga flera meningar i samma stycke men på separata rader utan att detta skapar ett nytt stycke.
 27När detta rendreras kommer det alltså inte att bli några radbrytningar.
 28
 29Detta är andra stycket. Här har vi låtit nästa mening fortsätta på samma rad för att visa att det blir likadant.
 30
 31_(Vill man tvinga en radbrytning inom ett stycke kan man avsluta raden med två mellanslag.)_
 32
 33### Formatering av text
 34
 35- *Kursiv:* Omge text med med ett understreck `_` eller med asterisk `*` för att göra den *kursiv*. `*kursiv text*` → *kursiv text*
 36- **Fetstil:** Omge text med med två understreck `__` eller två asterisker `**` för att göra den **fet**. `**fet text**` → **fet text**
 37- ~~Överstrykning:~~ Omge text med dubbla tilde `~~` för att göra den ~~överstruken~~. `~~överstruken text~~` → ~~överstruken text~~
 38- Kombinationer: Vi kan kombinera dessa formateringar för att skapa mer komplex formatering. `~~***överstruken kursiverad fetstil***~~` → ~~***överstruken kursiverad fetstil***~~.
 39
 40### Kod i Markdown
 41
 42För att formatera kod i Markdown kan man använda enkla backticks `` ` `` för _inline_-kod (kod som står i vanliga löptexten). T.ex. `` `print("Hello, World!")` `` → `print("Hello, World!")`. _(Ska ett backtick-tecken inkluderas i koden kan man använda dubbla backticks ``` `` ```, vilket jag fick använda för dessa exempel eftersom kurshemsidan som sagt författas i just Markdown.)_
 43
 44Ska man skriva ett längre stycke kod med flera rader använder man tre backticks och datorspråkets namn för att starta ett _kodblock_ (_fenced codeblock_), t.ex. `` ```python `` för att inleda ett Python-kodblock. Man skriver sedan Python-koden på följande rader, och kodblocket avslutas sedan med tre backticks `` ``` ``.
 45
 46Skriver vi t.ex.
 47
 48````markdown
 49```python
 50print("Hello, World!")
 51```
 52````
 53
 54Så kommer det att renderas som ett Python-kodblock, med syntax highlight och allt. Eventuellt också med radnummer beroende på rendrerarens inställningar.
 55
 56```python
 57print("Hello, World!")
 58```
 59
 60### Listor
 61
 62#### Punktlistor
 63
 64Använd `-` för punktlistor. Varje rad som inleds med `-` blir en punkt i listan men precis som för vanliga stycken kan man bryta rader utan att det blir en ny punkt. Skriver vi t.ex.
 65
 66```markdown
 67- Här är en punkt.
 68  Här är fortsättning på den första punkten.
 69- Här är en annan punkt.
 70```
 71
 72Så rendreras det som:
 73
 74- Här är en punkt.
 75  Här är fortsättning på den första punkten.
 76- Här är en annan punkt.
 77
 78#### Numrerade listor
 79
 80Använd `1.`, `2.`, `3.` osv. för numrerade listor. Skriver vi t.ex. följande (Obs! Numrena längst till vänster är radummer, och de faktiska numren i Markdown kan vara vilka som helst eftersom Markdown automatiskt räknar upp dem):
 81
 82```markdown
 836. Sjätte punkten.
 84   Fortsättning på sjätte punkten.
 857. Sjunde punkten.
 868. Åttonde punkten.
 87```
 88
 89Så rendreras det som:
 90
 916. Sjätte punkten.
 92   Fortsättning på sjätte punkten.
 937. Sjunde punkten.
 948. Åttonde punkten.
 95
 96#### Nästlade listor
 97
 98Vi kan nästla listor genom att indentera underpunkter med två eller fyra mellanslag. Vi kan nästla och blanda både punktlistor och numrerade listor på detta sätt. Skriver vi t.ex.
 99
100```markdown
101- Första punkten.
102    1. Första underpunkten.
103    2. Andra underpunkten.
104- Andra punkten.
105```
106
107Så rendreras det som:
108
109- Första punkten.
110    1. Första underpunkten.
111    2. Andra underpunkten.
112- Andra punkten.
113
114### Länkar och bilder
115
116Använd `[text](url)` för att skapa länkar. T.ex. blir `[Google](https://www.google.com)` till [Google](https://www.google.com).
117
118Man kan också skriva ut en länk direkt utan att ge den ett namn genom att omge den med `<` och `>`, t.ex. `<https://use.mazemap.com/?utm_medium=longurl#v=1&config=liu&campusid=742&zlevel=3&center=15.574954,58.397789&zoom=19.8&sharepoitype=identifier&sharepoi=E0007006%3A3G%3A442>`. Detta blir i texten en klickbar länk: <https://use.mazemap.com/?utm_medium=longurl#v=1&config=liu&campusid=742&zlevel=3&center=15.574954,58.397789&zoom=19.8&sharepoitype=identifier&sharepoi=E0007006%3A3G%3A442>.
119
120_(Många Markdown-redigerare och plattformar stöder även automatisk länkigenkänning, vilket innebär att om du skriver en fullständig URL i texten, kommer den ofta att omvandlas till en klickbar länk automatiskt även om du inte omger den med `<` och `>`. Det korrekta är dock att alltid omge URL:er med `<` och `>` för att säkerställa att de renderas korrekt som klickbara länkar oavsett plattform.)_
121
122Använd `![alt-text](url)` för att infoga bilder. T.ex. blir `![Exempelbild](https://cdn2.thecatapi.com/images/37a.gif)` till:
123
124![Exempelbild](https://cdn2.thecatapi.com/images/37a.gif)