En artikel fra: infrateket.dk
Her er en super kort introduktion til HTML.
Du lærer om:
Hypertekst til fremvisning på en computerskærm kan opbygges ved hjælp af HTML-koder, der gemmes i en datafil; et såkaldt HTML-dokument.
HTML står for Hypertext Markup Language. Et "Markup Language" er en kodeform, som anvendes til at inddele og markere et tekstdokument i nogle "blokke". Markeringerne bevirker, at tekst-blokkene kan vises på forskellige måder, afhængigt af formålet med teksten. Én markering kan f.eks. være en kode, som fortæller at tekstblokken skal vises som en stor overskrift, mens en anden betyder at den skal vises som almindelig tekst.
Alle HTML-koder skrives med helt almindelige karakterer, der findes i ASCII-karaktersættet. Dermed kan man benytte et simpel tekst-redigeringsprogram til at skrive eller redigere sine HTML-kodede dokumenter.
Eksempel:
<p>Ligesom denne linie, så indeholder et HTML-dokument koder, som f.eks. fortæller, hvor hver blokopdeling begynder og slutter</p>
<p> Er et start-mærke, mens </p> er et slut-mærke. Det engelske ord for mærkeseddel eller etiket er "tag", og HTML-koderne kaldes derfor for HTML-tags.
Der findes mange forskellige tags, der hver især angiver en eller anden form for information om hvordan browseren skal vise den tekst og de billeder, der er indeholdt i HTML-dokumentet.
Bemærk
Vi vil lave et lille dokument ved hjælp af HTML. Det skal se således ud, når vi ser det på vores computerskærm:
|
Dette er min første tekst på en HTML-side. Denne tekst er Fed (bold). Denne tekst er kursiv (italic). Denne tekst er både kursiv og fed. Her er et link til www.infrateket.dk |
HTML-kildekoden til det lille dokument vil se således ud:
(koderne er farvet og rykket lidt ind i
forholdet til hinanden, så du bedre kan finde rundt i dem; der er ikke farver i
HTML-kode)
| HTML kildekode (Klik her for at se en side lavet med denne kode). |
<html>
<head>
<title>Dette er sidens titel</title>
</head>
<body>
<p>Dette er min første tekst på en HTML-side.</p>
<p><b>Denne tekst er Fed (bold).</b></p>
<p><i>Denne tekst er kursiv (italic).</i></p>
<p><b><i>Denne tekst er både kursiv og fed.</i></b></p>
<p>Her er et link til <a href="http://www.infrateket.dk">www.infrateket.dk</a>
</body>
</html>
|
|---|
Koderne som teksten er opmærket med kaldes "tags" (engelsk for: mærker; mærkesedler). De bruges til at opmærke teksten i blokke, der vises eller behandles på hver sin måde, når browseren skal vise siden. De enkelte tags' navne er engelske ord eller begreber, eller forkortelser af disse.
HTML-siden ovenfor er opbygget af følgende blokke (tags):
| Tag | Beskrivelse |
|---|---|
| <html> </html> | Fortæller din browser at her starter et HTML-dokument. Det sidste
tag </html> fortæller din browser at her slutter HTML-dokumentet. Mange tags indeholder altså både et start-tag og et slut-tag, der indeslutter en eller anden information. |
| <head> </head> |
(Engelsk for: Hoved) Indeholder information til browseren om dokumenter. Denne information vises ikke i browserens vindue, men anvendes til andre formål. (her indeholder den f.eks. et <title>-tag. |
| <title> </title> | (Engelsk for: Titel) Indeholder dokumentets titel som vises i browser-vinduets titellinie. |
| <body> </body> |
(Engelsk for: Krop) Indeholder det der skal vises på skærmen i browserens vindue. |
| <p> </p> | (paragraf; Engelsk for: Afsnit) Indeholder et tekstafsnit. |
| <b> </b> | (bold; Engelsk for: Fed) Indeholder tekst, der skal vises/fremhæves som fed skrift. |
| <i> </i> | (italic; Engelsk for: Kursiv) Indeholder tekst, der skal vises/fremhæves som kursiv skrift. |
| <a...> </a> | (anchor: engelsk for bindeled; sammenhold) Indeholder et hyperlink til et andet dokument evt. på et helt andet web-site. Det viste <a>-tag er sammensat således: <a href="adresse">Vist tekst</a> Bemærk her at et tag også kan indeholde forskellige parametre. For <a> er det f.eks. link-adressen. |
Nu ved du lidt om, hvordan systematikken i et HTML-dokument er opbygget. Der findes mange flere tags end dem, der er vist i dette dokument. Hvis du vil vide mere, så prøv disse links:
http://www.html.dk (på Dansk).