watch live match 20

Grunder i HTML

Grunder i HTML

Hur man bygger upp ett HTML-dokument

Här följer lite grunder i HTML och ett exempel på det i stort sett enklaste HTML-dokument man kan skapa. Det är kanske inte särskilt spännande men viktigt.

Börja HTML-dokumentet med att skriva <!DOCTYPE html>. En doctype berättar för den som läser koden att nu handlar det om ett HTML-dokument. I det här fallet ett standard-HTML5-dokument. Denna nya HTML5-doctype är mycket kortare än tidigare doctypes och fungerar bra i alla webbläsare, även om du inte kommer använda några nya HTML5-objekt förövrigt i dokumentet. Om man inte anger en doctype kan visa webbläsare gå in i ”quirks mode” (T.ex. IE) och förvrida layouten.

Lägg nu till taggen <head> och avsluta den med </head>. Innanför head-taggarna kan man sedan lägga in title, meta-taggar, stylesheets, javascript m.m.

Om vi lägger till title, några meta-taggar, ett enkelt javascript och ett stylesheet (CSS) så har vi nu alltså följande grunder i dokumentet.


<!DOCTYPE html>
<head>
<meta charset="utf-8">
<link href="style.css" rel="stylesheet">
<script src="script.js>

<title> Grunder i HTML </title>

</head>


För att lite snabbt förklarar vad ovanstående innebär är <meta charset=”utf-8″> en metatagg som definierar en teckenkod så t.e.x. bokstäverna ÅÄÖ visas på rätt sätt. <link href="style.css" rel="stylesheet"> visar att HTML-dokumentet ska hämta sin CSS, sitt Stylesheet från ett dokument som heter style.css. <script src="script.js> hänvisar till en fil där javascript-kod som ska användas i HTML-dokumentet kommer hämtas. Innehållet i <title> är det som visas i webbläsarens namnlista längst upp och det som visas som rubrik i sökresultat hos bland annat Google.

Nu ska vi bara få in lite innehåll i dokumentet och det gör vi med taggarna <body>,<p> och <img>. <body> är starttaggen för allt innehåll och innehållet ska avslutas med taggen </body>. <p> är en paragraf som innehåller text och <img> är en tagg för en bild. Attributet alt är en beskrivning av bilden som används av bland annat sökmotorer och kommunikationshjälpmedel.


<!DOCTYPE html>
<head>
<meta charset="utf-8">
<link href="style.css" rel="stylesheet">
<script src="script.js>

<title> Grunder i HTML </title>

</head>

<body>
<p>Lite text om grunderna i HTML...</p>
<img src="grunderihtml.jpg" alt="En bild om grunder i HTML">
</body>


Det där var de absoluta grunderna i HTML. Hoppas det var till någon hjälp. Kontakta gärna mig om du behöver hjälp med din HTML eller CSS!

deneme bonusu veren siteler deneme bonusu gaziantep escort bayan gaziantep escort bahis siteleri canlı bahis
deneme bonusu veren siteler deneme bonusu deneme bonusu