Klikamok's HTML 3.2 dokumentation


Tags skrevet med blåt kan bruges efter behov. Vi anbefaler ikke brug af tags skrevet med rødt. Tags skrevet med grønt skal bruges. Bemærk at denne webside er skrevet i W3C valideret HTML 3.2 og CSS - læs mere på [ http://validator.w3.org ].            

<html>   <head>   <body>   <title>   <style>   <script>   <isindex>   <base>   <meta>   <link>   <h1>   <h2>   <h3>   <h4>   <h5>   <h6>   <address>   <p>   <ul>   <li>   <ol>   <dl>   <dt>   <dd>   <menu>   <dir>   <pre>   <div>   <center>   <blockquote>   <form>   <hr>   <table>   <caption>   <tr>   <td>   <tt>   <em>   <i>   <b>   <strong>   <u>   <strike>   <big>   <small>   <sub>   <sup>   <dfn>   <code>   <sample>   <kbd>   <var>   <cite>   <input>   <select>   <option>   <textarea>   <a>   <img>   <map>   <area>   <applet>   <param>   <font>   <basefont>   <br>


<html> elementer

Erklæring     Mulige koder     Beskrivelse     Eksempel
 
<html></html>   - Starten og slutningen på en HTML fil. Før <html> bør dog skrives:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
Eksempel på html elementerne:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<html>
<head>
..header informationer her..
</head>
<body bgcolor="#FFFFFF" text="#000000">
..sidens indhold her..
</body>
</html>
 
<head></head>   - Head elementer omkranses af <head></head>
 
<body></body>   bgcolor, text, link, vlink, alink, background Alt visuelt indhold på websiden skal omkranses af <body></body>.
bgcolor= angiver baggrundfarve på siden.
text= angiver tekstfarve på siden.
link= (ikke bsøgt link), vlink= (besøgt link) og alink= (aktivt link) angiver links farve.
background= angiver grafik fil baggrund til siden.
 

<head> elementer

Erklæring     Mulige koder     Beskrivelse     Eksempel
 
<title></title>   - Titel på webside. Giver tekst i browserens øv. tv. hjørne. <title>Klikamok, forside</title>
 
<style></style>
<script></script>
   language Indsættelse af style (f.eks. CSS) eller af client-side kode (f.eks. JavaScript). <style>
body { font-size:12px; }
</style>
<script language="JavaScript">
alert("Hej Verden");
</script>
 
<isindex>   prompt Udfører en forudbestemt query på en url. <isindex prompt="search">
 
<base>   href Giver en "base url" til alle src elementer. <base http="http://www.klikamok.dk">
 
<meta>   name, http-equiv, content Giver oplysninger om dokumentet. Meta tags bruges f.eks. ofte af søgerobotter. Læs mere om Meta Tags i artkel samlingen på klikamok.dk <meta name="keywords" content="html, css, javascript, php, asp, sql, mysql">
 
<link>   href, title, rel, rev Giver oplysninger om og til HTML filen. F.eks. et stylesheet.
href= angiver stien/filnavnet.
title= angiver filens titel.
rel= angiver hvilken type fil.
<link rel="stylesheet" href="htmltags.css">
 

<body> elementer

Erklæring     Mulige koder     Beskrivelse     Eksempel
 
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
       align Overskrifter. Giver automatisk linieskift.
Koden align= kan modtage: "left", "center" og "right"
<h3 align="center">Velkommen til Klikamok</h3>
 
<address></address>   - Giver information om ophavsret. <address>Niels Rune Bøggild
Rune@klikamok.dk</address>
 
<p></p>   align En paragraf. Giver linieskift. <p>Her er noget tekst..</p>
 
<ul>
<li></li>
</ul>
   ul: type, compact Laver en liste med bullets.
Koden type= kan være: "square", "circle" og "disc"
<ul type="disc">
<li>Et punkt</li>
<li>Et andet punkt</li>
</ul>
 
<ol>
<li></li>
</ol>
  ol: type, start, compact
li: value
Laver en liste med nummererede bullets.
Koden for type= kan være: "1", "a", "A", "i", "I"
Koden start= fortæller hvor der tælles fra
<ol type="A" start="3">
<li>Et punkt</li>
<li>Et andet punkt</li>
</ol>
 
<dl>
<dt></dt>
<dd></dd>
</dl>
    dl: compact Laver en liste uden bullets.
dt: Liste navn
dd: Liste punkt
<dl>
<dt>første liste</dt>
<dd>Et punkt</dd>
<dt>Anden liste</dt>
<dd>Et punkt</dd>
</dl>
 
<menu>
<li></li>
</menu>
  - Identisk med <ul> -
 
<dir>
<li></li>
</dir>
  - Identisk med <ul> -
 
<pre></pre>   - pre-formateret tekst.
Her registreres linieksift og mellemrum.
<pre>
Her er     lidt
    tekst ...
</pre>
 
<div></div>   align En paragraf.
align= kan modtage: "left", "center" og "right"
<div align="right">Noget tekst</div>
 
<center></center>   - En paragraf, som centerer elementer <center>Noget tekst</center>
 
<blockquote>
</blockquote>
  - En paragraf, som gier [tabulator] indrykning <blockqoute>Noget tekst</blockquote>
 
<form></form>   action, method, enctype Starter og slutter <input> felter og foræller hvilken 'action' der skal udføres på disse.
Koden method= kan være: "post" eller "get".
<form> bør bruges i stedet for <isindex>
<form action="send.cgi" method="post">
Her er input felterne mm.
</form>
 
<hr>   align, noshade, size, width En horizontal linie. Koden align= kan være: "left, "center" og "right". Size= angiver højde i pixels. Width angiver bredde i pixels eller procent. Noshade fjerner skygge. <hr width="10%" size="4" noshade>
 
<table>
<caption></caption>
<tr>
<td></td>
</tr>
</table>
     table: align, width, border, cellspacing, cellpadding
caption: align
tr: align, valign
td: align, valign, width, height, rowspan, colspan, nowrap
Laver tables. Vi anbefaler at du udelader at putte koder i <tr>.
Koden align= kan være: "left", "center" og "right".
Koden align= brugt i <caption> kan være: "top" og "bottom".
Koden valign= kan være: "top", "middle" og "bottom".
Koden width= og height= skal have størrelse i pixels eller procent.
<table border="0" cellspacing="0" cellpadding="0" width="400">
<tr>
<td width="300">Prisen er kr.</td>
<td align="right">295,-</td>
</tr>
</table>
 
<tt></tt>   - Teletekst.. <tt>Noget tekst</tt>
 
<i></i>
<em></em>
   - Kursiv (italic) tekst. <i>Noget tekst</i>
 
<b></b>
<strong></strong>
   - Fed (bold) tekst. <b>Noget tekst</b>
 
<u></u>   - Understreget tekst. <u>Noget tekst</u>
 
<strike></strike>   - Tekst med en streg igennem. <strike>Noget tekst</strike>
 
<big></big>   - Tekst med en lidt større størrelse. <big>Noget tekst</big>
 
<small></small>   - Tekst med en lidt mindre størrelse. <small>Noget tekst</small>
 
<sub></sub>   - Tekst som er sænket.. så du f.eks. kan skrive H2O H<sub>2</sub>O
 
<sup></sup>   - Tekst som er hævet.. så du f.eks. kan skrive x2 x<sup>2</sup>
 
<dfn></dfn>   - En definiton. Giver kursiv tekst. <dfn>Noget tekst</dfn>
 
<code></code>   - Til programmerings kode. Laver skrivemaskine agtig tekst. <code>Noget tekst</code>
 
<sample></sample>   - En tekst frase fra eks. et program. <sample>Noget tekst</sample>
 
<kbd></kbd>   - Tekst som brugeren skal indtaste. <kbd>Noget tekst</kbd>
 
<var></var>   - Når du skal vise variabler. Laver kursiv tekst. <var>Noget tekst</var>
 
<cite></cite>   - Når du skriver citater. Laver kursiv tekst. <cite>Noget tekst</cite>
 
<input>   type, name, value, checked, size, maxlength, src, align type= repræsenterer inmput felt typen.
name= bruges eks. når du ref. til feltet fra javascript, eller hvis du sender værdien videre.
value= fortæller input feltets værdi/indhold.
size= beskriver input feltets bredde.
maxlength= definerer max. antal tegn som kan indtastes.
src= giver dig mulighed for at bruge en grafik fil.
align= gør at du kan aligne feltet: top, middle, bottom, left, center eller right.

Jeg udspecificerer de forskellige typer herunder..
-
 
<input type="text"> name, value, size, maxlength Et indtastningsfelt. <input type="text" name="email" size="9" value="din@mail.her">
 
<input type="password"> name, maxlength Et indtastningsfelt med *er som indtastning. <input type="password" name="pswrd">
 
<input type="checkbox"> name, value, checked En checkbox. <input type="checkbox" name="valg1" checked>
<input type="checkbox" name="valg2">
 
<input type="radio"> name, value, checked En radio valg knap ting. <input type="radio" name="valgA" checked>
<input type="radio" name="valgA">
 
<input type="submit"> name, value En 'udfør handlingen' knap. <input type="submit" name="udfoer">
 
<input type="image"> src, alt, align, height, width, border En 'udfør handlingen' knap med grafik understøttelse. Virker som <img> tag'n, men sender også knappens [x,y] koordinater med. <input type="image" name="udfoer" src="knap.gif" width="200" height="50" alt="en knap" align="top" border="0">
 
<input type="reset"> value En 'jeg fortryder! slet alt' knap. <input type="reset" value="slet alt">
 
<input type="file"> size, name, maxlength En 'browse efter og upload fil' knap. <input type="file" name="enfil" size="9" maxlength="25">
 
<input type="hidden"> name, value Et skjult indtastningsfelt. <input type="hidden" name="title" value="Fra klikamok.dk">
 
<select>
<option></option>
</select>
   select:name, size, multiple
option: value, selected
En dropdown box.
name= bruges eks. når du ref. til feltet fra javascript, eller hvis du sender værdien videre.
size= ændrer udseende på dropdown boxen.
multiple gør at du kan vælge flere punkter vha. CTRL / SHIFT.
value= giver værdi/indhold til et valg.
selected gør at et punkt er valgt på forhånd.
<select name="valg" size="2" multiple>
<option value="1">Jordbær<option>
<option value="2" selected>Brombær<option>
<option value="3">Blåbær<option>
</select>
 
<textarea>
</textarea>
  name, cols, rows En indtastnings kasse.
name= bruges eks. når du ref. til feltet fra javascript, eller hvis du sender værdien videre.
cols= angiver bredde i antal tegn..
rows= angiver højde i linier.
textarea'ens "value" er det der står imellem start og slut tag.
<textarea name="besked" cols="40" rows="4">skriv tekst her</textarea>
 
<a href=""></a>   href, title, rev, rel Alt imellem <a href="##> og </a> er et link.
href= definerer hvad linket aktiverer.
title= er linkes titel.
rel= og rev= angiver hvad linkets type og værdi-type.
<a href="kontakt.html" title="Kontakt os her">Kontakt os</a>
 
<a href="mailto:"></a> href, title, rev, rel Nøjagtigt som <a href=""></a> linket - dette link åbner dog et "send Email" vindue. <a href="mailto:rune@klikamok.dk" title="Kontakt Rune her">Kontakt Rune</a>
 
<a name=""></a> name Angiver "mål" for et target. Skriver du et link f.eks. således: <a href="side.html#B">Gå til B</a> vil siden scrolle ned til stedet hvor der står <a name="B"></a> når linket aktiveres. (se forklaringen)
 
<img>   src, alt, align, height, width, border, hspace, vspace, usemap, ismap En grafik tag.
src= angiver grafik filen.
alt= angiver titel på grafik filen.
align= angiver placering: top, middle, bottom, left, center eller right.
height= og width= angiver størrelsen i pixels.
border= angiver evt. tykkelse på kant.
hspace= (vandret) og vspace= (lodret) angiver luft omkring billedet.
usemap= og ismap= angiver "navn", hvis billedet bruges som imagemap (se <map>).
<img src="bil.gif" width="200" height="100" alt="min bil" border="0">
 
<map>
<area>
</map>
   map: name
area: shape, coords, href, nohref, alt
Et client-side imagemap.
name= i <map> tag'n skal være samme navn, som en <img< tag's usmap= navn.
shape= og coords= angiver område i billedet som er klikbart. shape= kan have værdierne: circ, rect eller poly.
href= / nohref= angiver hvilken handling der skal udføres ved klik på området.
alt= angiver titel på klikbart område.
<img usemap="#minbil" src="bil.gif" border="0" width="50" height="200">
<map name="minbil">
<area shape="rect" coords="0, 0,50,100" href="top.html">
<area shape="rect" coords="0,100,50,200" href="bund.html">
</map>
 
<applet>
<param>
<applet>
   applet: codebase, code, alt, name, width, height, align, hspace, vspace
param: name, value
Vi anbefaler at du ikke bruger applets. Hvis du gør følger forklaring på den applet du har fundet formodentligt med.
Det er nødvendigt minimum at bruge code= (.class filen du skal bruge), width= og height= i <applet> koden.
<applet code="Time.class" width="100" height="14">
<param name=fgcolor value="black">
<param name=bkcolor value="white">
<param name=gmt value="local">
</applet>
 
<font></font>   size, color Angiver tekst udseende.
size= angiver tekst størrelse med værdien: 1 - 7 eller +2, +1, -1, -2 etc..
color= angiver tekst farve.
I HTML 3.2 er face= ikke understøttet. face= angiver hvilken font der ønskes brugt.
<font color="#A30000" size="-2">noget tekst</font>
 
<basefont>   size Angiver tekstens default størrelse på hele siden. size= skal være 1 - 7. <basefont size="4">
 
<br>   clear Laver et linieskift. Linieskift kan styres i forhold til andre elementer vha koden clear=. clear= kan have følgende værdier: left, right og all. <br clear="all">
 

Skrevet okt. 2001 af Niels Rune Bøggild