Generell fakta om HTML stycken

HTML-elementet <p> definierar ett stycke. Ett stycke börjar alltid på en ny rad. Webbläsaren lägger automatiskt till lite mellanrum (en marginal) före och efter ett stycke.

HTML-stycken på webben

Stora/små skärmar samt ändrade fönsterstorlekar påverkar hur HTML-dokumentet visas. Webbläsaren kommer även automatiskt ta bort extra mellanslag och rader när sidan visas. Detta gäller även för radbrytningar som skrivs inom taggen <p>. Denna dikt kommer till exempel att visas på en enda rad:

<p>
  My Bonnie lies over the ocean.

  My Bonnie lies over the sea.

  My Bonnie lies over the ocean.

  Oh, bring back my Bonnie to me.
</p>

För att visa texten såsom den är skriven kan man använda sig av HTML-elementet <pre>, som definierar förformaterad text. Texten inuti en <pre>-tagg visas med ett fixed-width* typsnitt (vanligtvis Courier), som bevarar både mellanslag och radbrytningar.

* “Fixed-width font” refererar till en typsnittsstil där varje tecken har samma breda utrymme, oavsett tecknets faktiska bredd. Varje tecken tar upp lika mycket horisontellt utrymme, vilket skapar en jämn och konstant bredd för varje tecken.

Horisontella linjer

Taggen <hr> definierar en tematisk brytning på en HTML-sida och visas oftast som en horisontell linje. Elementet <hr> används för att separera innehåll (eller definiera en förändring) på en HTML-sida. Exempel:

<h1>Detta är rubrik 1</h1>
<p>Detta är lite text.</p>
<hr>
<h2>Detta är rubrik 2</h2>
<p>Detta är annan text.</p>
<hr>

Taggen <hr> är en tom (empty) tagg, vilket innebär att den inte har någon sluttagg.

Radbrytningar i HTML

HTML-elementet <br> definierar en radbrytning. Använd <br> om du vill göra en radbrytning (en ny rad) utan att skapa ett nytt stycke. Taggen <br> är en tom (empty) tagg, vilket innebär att den inte har någon sluttagg.

Använd HTML-taggen <pre> </pre> för att skriva kod precis som den har skrivits i HTML-koden. <pre>-taggen bevarar både mellanslag och radbrytningar, vilket <p> inte gör). Exempel:

<pre>
  Detta är exempeltext1.

  Detta är exempeltext2.

  Detta är exempeltext3.

  Detta är exempeltext4.
</pre>