14. marts 2010
Kommentare: (0)

Hjemmeside HTML/CSS tutorial: Kapitel 3

Nu har jeg endelig fået skrevet kapitel 3, jeg undskylder for den lange ventetid, men har haft travlt med nogle lektier, så har derfor ikke fået skrevet nogle indlæg.

I dette kapitel vil du lære nogle flere tags, som du kan bruge på din hjemmeside.

<br />

Dette tag bruger du til at lave et linjeskift, for eksempel hvis jeg skriver:

<p>Hej Lasse <br/>Hvad laver du?</p>

Det kommer til at se sådan her ud i browseren:

Hej lasse
Hvad laver du?

Som du kan se, bruger dette tag ikke et åbningstag og et lukketag, det både åbner og lukker i samme tag, hvilket er gjort ved at skrive en / efter kommandoen. Dette skyldes, at tagget ikke fortæller noget om, hvordan en mængde tekst skal se ud, som vi snakkede om i kapitel 1.

Man kan bruge dette tag inde i et andet tag men også efter et tag, det vil sige:

<p><br /></p>

Eller

<p></p><br />

<hr />

Med dette tag kan man lave en horisontal linje, altså en streg som er horisontal. Det ser sådan her ud i browseren, hvis man skriver:

<hr />
Igen åbnes og lukkes tagget det i samme tag, og man kan for eksempel bruge det, efter man har skrevet en mængde skrift til at vise, at nu starter man et nyt afsnit, for eksempel:

Læs resten af dette indlæg »

28. februar 2010
Kommentare: (0)

Hjemmeside HTML/CSS tutorial: Kapitel 2

Så er vi nået til kapitel 2 i tutorialen.
I dette Kapitel skal vi lave vores første hjemmeside, den bliver meget enkelt, så forvent ikke noget vildt endnu.

Så går vi i gang:

Først skal du starte med at åbne Notepad++, hvis du installerede dette, hvis ikke, skal du åbne Notepad/Notesblok.

Først starter vi med at indsætte det vi lærte i kapitel 1, altså hvorden HTML-koden er opbygget på en hjemmeside uden noget indhold:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” lang=”da”>
<head>
</head>
<body>
</body>
</html>

Lad os starte med at bruge tagget <title></title> og skriv dette i head’et, sådan her:

<head>
<title></title>
</head>

Tagget ”title” er som du nok har regnet ud en titel og når vi har skrevet den i head’et, så er det altså titlen på hjemmesiden.

Skriv så inde i title tagget ”Min første hjemmeside”:

<title>Min første hjemmeside</title>

Tryk derefter på gem og kald filen hjemmeside.htm eller hjemmeside.html, sådan her:

Læs resten af dette indlæg »

22. februar 2010
Kommentare: (0)

Hjemmeside HTML/CSS tutorial: Kapitel 1

Jepper, så er vi nået til næste kapitel i HTML tutorialen. Jeg har prøvet at gøre det så forståeligt som muligt for alle, men hvis det viser sig stadigvæk at være lidt uklart, er du meget velkommen til at skrive en kommentar nederst, og så vil jeg rette det i tutorialen.

I dette kapitel skal vi lære hvordan HTML-koden er opbygget og lære hvad “tags” er for noget.

HTML kodens opbygning:

En hjemmeside helt uden noget indhold ser i HTML-koder sådan her ud:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” lang=”da”>
<head>
</head>
<body>
</body>
</html>

En hjemmeside består af et head og en body (et hoved og en krop). Man kan sige at head’et er det psykiske på hjemmeside, og body’en er det fysiske.

Det man skriver i head’et er alt baggrunden til hjemmesiden, det vil sige, her skriver man hvordan layoutet skal være, titlen på hjemmesiden m.m.

I body’en skriver man alt det man kan se på hjemmesiden, det ville sige, her skriver man den tekst der skal stå på hjemmesiden, de billeder der skal være på den osv.

Hvad betyder de forskellige dele?:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/transitional.dtd”>

Denne linje fortæller browseren hvilken slags kode det er, så den ved hvordan den skal behandle den efterfølgende HTML-kode. Dette skal du ikke bide så meget mærke i, da det ikke er så vigtigt for dig endnu, da denne tutorial kun skal lære dig det grundlæggende.

Læs resten af dette indlæg »

12. februar 2010
Kommentare: (2)

Hjemmeside HTML/CSS tutorial: Indledning

Så har jeg besluttet mig for at gå igang med en tutorial til hvordan man laver en hjemmeside, den vil blive lavet i flere indlæg, da det bliver for meget at lave det i en omgang.

Hvad kan du så forvente at lære ud fra denne tutorial?

Du tror måske at det er svært at lave en hjemmeside? Det kan jeg heldigvis fortælle dig at det ikke er. Faktisk er det meget simpelt at lave en hjemmeside, når man først har forstået princippet. Det vil selvfølgelig være svært i starten at lave en hjemmeside med et flot design og avancerede funktioner, men dette vil jeg hjælpe dig med at lære efterhånden som vi kommer længere hen i tutorialen.

I denne tutorial vil jeg starte helt fra bunden af og derefter gøre det mere og mere avanceret. Det kræver derfor ingen kendskab til HTML koder på forhånd og du kan straks gå igang med denne tutorial.

Jeg vil vil lære dig at skrive koden til hjemmesiden selv og ikke ved hjælp af et program. Jeg ved godt at man kan få avancerede programmer til næsten at lave hjemmesiden for dig, men hvis man vil gøre det ordentligt må man gøre det selv. Ej man kan sagtens bruge et program, men jeg har altid skrevet koden i hånden og dette fungerer perfekt for mig, da jeg ved præcis hvad det er jeg laver.

Hvad skal du bruge?

Måske tror du at man skal bruge avancerede programmer for at lave en hjemmeside, dette er slet ikke tilfældet. Du har allerede alt hvad der skal bruges nemlig en browser (Chrome, Firefox, Safari, Internet Explorer) og en text editor (Notepad/Notesblok), det er alt.

Du behøver ikke engang at have forbindelse til internettet når du skal lave din hjemmeside, så du kan derfor uden problemer printe denne tutorial ud og tage den med op på din ødegård i Sverige og øve dig.

Læs resten af dette indlæg »

|