toppbanner

Main topics

Study techniques
Religion and view of life
Denominations and church history
Ethics and Philosophy
Pedagogy
ICT
Math, technology and science
CV and publications
Miscellaneous

Search in this website:

Choose articles by genre:

V Essays, papers
A Other papers
U Education, lectures
O Tables or summaries
S Citations
F Readers fruits
K Textbook summaries
T Speaches, sermons
L Links
P Web portal
D Miscellaneous
G Thoughts
All articles, cronological
All articles, alphabetical

My websites:

Non Aliud professional
Semaphore railway Viaduct model railroad

Enkle html-koder

Utseende på teksten på internettsider ordnes med såkalt html-kode. For å få til de helt grunnleggende ting, trenger man egentlig bare lære seg et fåtall koder. De vil bli gjennomgått her.

Koden består av såkalte "tags". En tag sarter med <og slutter alltid med >. Ettersom hva som står inne i < > gjør koden forskjellige ting med den som følger etter tagen. Når man skal avslutte det starttagen gjør, setter man inn en sluttag som ligner på starttagen, bare at den har / som første tegn i tagen.

La oss ta et eksempel samtidig som vi lærer en tag. Tagen for stor overskrift er <h1> (heading 1). Den av sluttes med </h1>.
Det finnes overskrifter i forskjellige størrelser. Jo større tall man har bak "h"-en, jo mindre blir overskriften.:
<h1>Kjempestor overskrift</h1> blir:

Kjempestor overskrift

<h2>Litt mindre overskrift</h2>blir:

Litt mindre overskrift

<h3>Enda litt mindre overskrift</h3> blir:

Enda litt mindre overskrift

Sluttegnet for overskrift, fx </h1>, med fører alltid at neste tekst kommer på ny linje med luft foran. Dette kan man få til hvor man vil også. Da setter man inn avsnittstragen som ser slik ut: <p> (engelsk: "paragraph")

Hvis man bare vil ha linjeskfit uten luft foran, setter man inn <br> (engelsk: "break")

Understrekning: <u>Denne teksten blir understreket</u>

Fet skrift: <b>Dette teksten blir fet</b>

Kursiv: <i>Denne teksten blir skråstilt</i>

Klikkbare lenker til andre internettsider lager man med tagen <a href="nettadressen">tekst som skal være klikkbar</a>. La oss ta et eksempel:
<a href="http://www.aftenposten.no">Aftenposten</a> blir til:
Aftenposten

Bilder settes inn med tagen <img src="nettadressen til billedfilen">. Denne tagen har altså ingen sluttag. La oss igjen ta et konkret eksempel:
<img src="http://www.dmmh.no/~ses/basic/tronderen.jpg"> gir
http://www.dmmh.no/~ses/basic/tronderen.jpg

Kuleliste består av to sett tager der den ene definerer selve listen <ul> ... </ul>, og den andre enkeltlinjene <li> ...</li>:

<UL>
<LI>Kule 1</LI>
<LI>Kule 2</LI>
</UL>

Ovenstående kode gir:

  • Kule 1
  • Kule 2

Automatisk nummerert liste lages tilsvarende med  <ol> ... </ol> som listedefinisjon;  <li> ...</li> for enkeltlinjer som over.

TIl slutt litt om tabeller. Her er det snakk om tre typer tagpar som skal flettes i hverandre på en riktig måte. Rekkefølgen er pinlig nøyaktig, ellers blir det bare ball av det, eller teksten framstår som vanlig tekst uten særskilt tabellformatering.
Ytterst setter man et tagpar som definerer selve tabellen: <table> .... </table>
Dernest et tagpar som definerer en linje i tabellen: <tr> ...</tr> (engelsk: table record)
Så et tagpar for hver kolonne i denne linjen: <td>celleinnholdet</td> (engelsk: table data).
Eksempel:

<table>
<tr>
<td>celle 1</td><td>celle 2</td>
</tr>
<tr>
<td>celle 1 i linje 2</td><td>celle 2 i linje 2</td>
</tr>
</table>

gir
 
 

celle 1 celle 2
celle 1 i linje 2 celle 2 i linje 2

Man ser ikke at dette er en tabell annet enn ved at innholdet i kolonne 2 er plassert rett under hverandre. Slik koden er lagtet her, i sin helt enkle form, er det ikke angitt at tabellopprutingen skal synes. Det kan man få til ved å legge inn litt tilleggsinformasjon i tabelldefinisjonen, nemlig <table border="1">. Da blir tabellen slik:
 

celle 1 celle 2
celle 1 i linje 2 celle 2 i linje 2

Det finnes mange andre ting som kan legges inn i tabelldefinisjonen, men det fører det alt for langt å ta opp her. Nærmere interesserte i dette og andre finesser, kan lese i noe av de nedenstående - hvis engelsk ikke er noe hinder for deg.

Videre lesing om html-koding

w3-organisasjonens egen tutioral
More advanced features

Svein Sando, 29.5.00
 


This article is shown 9224 times

Ett tilfeldig blant 12 av mine antatt bedre bilder jeg har tatt selv:
menyadm/pix1/galleri/e0857.jpg

I dag 836 treff på nonaliud, og 2160404 totalt siden 20.04.2004 08:25. Dagsgjennomsnitt: 380 treff ·

© Svein Sando, PhD, Associate Professor at Queen Maud's College of Early Childhood Education (QMC), Trondheim, Norway
Phone +47 73 80 52 26 - fax: +47 73 80 52 52 - e-mail: seserstatt dette bildet med tegnet krøllalfadmmh.no               
Start page (Eng.) · Startside (Norw.) · · Display modes: Standard · Without menus: Arial · Times · Times spacious · Large ·    

The content of this webpage is subject to Norwegian legislation about copyright, which gives the author all publications wrights. Any further publication of this text and its pictures, completely or partly, can only be done after being authorized to do so by the author. Shorter citation in papers, students essays and so forth can be done if referring to the source. APA style reference to this webpage:

Sando, S. (2000). Enkle html-koder. Dronning Mauds Minne Høgskole. Downloaded 15.11.2019 from http://www2.dmmh.no/~ses/index.php?vis=85&nid=1&eng=1


Valid HTML 4.01!