HTML-taggar, så fungerar dom

HTML är språket man använder för att lägga ut saker på en hemsida. Det kan vara text, bilder eller video bl.a. Här ska jag nu försöka förklara den absolut mest grundläggande strukturen för HTML, vilken faktiskt inte är så svår.

Ett block kan se ut såhär:
<h1>En rubrik</h1>
eller
<p>Ett stycke text.</p>

Först talar man om vad för typ av block det är innanför två pilar <typ>.

Sedan anger man det som ska synas på hemsidan.

När blocket är slut anger man samma som blocket började med inklusive en högerlutande snedstreck (shift 7), </typ>.

När du i din kod skriver <h1>En rubrik</h1> kommer det på hemsidan synas ”En rubrik”, troligtvis ganska stor och fet text.

Stora eller små bokstäver spelar ingen roll i taggarnas typnamn. <h1> är samma sak som <H1>. Man kan skriva <h1>Rubrik</H1>.

Testa HTML-taggar själv

För att prova, skapa en fil som heter test.html i notepad eller någon texteditor. Skriv <h1>En rubrik</h1> i filen och spara. Gå till filen i din dator och högerklicka och välja att öppna den i din webbläsare (Chrome, Firefox eller Edge t.ex).

Undantag

Det finns några undantag som inte kräver slut-tag, exempelvis:
<br> – Radbrytning
<hr> – Vertikal skiljelinje.

Block i block

Hittills var det ganska enkelt, eller hur? Förutom några undantag (som man snart lär sig utantill) följer det ett enkelt mönster.

Som avslutning här visar jag hur man skriver block i block, det är helt nödvändigt att förstå om man vill skapa en det enklaste HTML-dokumentet.

Såhär kan det se ut:
<div>
<h1>Rubrik</h1>
<p>Lite text i ett stycke</p>
</div>

Först skapas ett block <div>, inuti den finns ett block <h1>..</h1>, sedan ett block <p>…</p>. Till sist avslutas det yttre blocket </div>.

Man kan ha block i block i block i block, i evigheter. Det viktiga är att varje block avslutas på rätt ställe. T.o.m den mest erfarna webbutvecklare får ibland fel på ej avslutade block, eller block som råkar avslutas på fel ställe. Var noggrann, det tjänar du på.