Har ni koder som ni tycker borde vara med, ska det vara bättre förklaringar, eller kommentarer och tips i övrigt
maila mig på arne-dykare.nr1@telia.com !

De flesta koder som finns med här har jag testat på Internet Explorer 4.0 och Netscape 4.03,
ju äldre webläsare = desto mindre som fungerar.

Det viktigaste när man lär man lär sig HTML är att våga testa olika saker.
De flesta tabbarna går att kombinera, med varandra och med olika komandon.
Om ni kikar runt på mina sidor får ni se exempel på olika kombinationer, vill ni se koden, finns det i visa menyn - källa (Heter olika med olika program)
Storlek, namn, sökväg, mm ska för det mesta anges imellan " tecken".

MenyHar änsålänge tagit med följande:

Lite olika tecken - å , Å , ä , Ä , ö , Ö , " , & , < , > , ø , Ø , mm.

<HTML>

<HEAD> - <META> mm.

<BODY> - bakgrund

Länkar (sökvägar) - Ankare , Bilder , Mail , Target

Text

Tabeller , storlek , ramarnas storlek, Färger (bakgrund, ramar) , mm.

Bilder , färga kanter , mm.

Färger

Blandat

Tecken.

Tänk på att alla inte har datorerna konfigurerade för svenska tecken och att de tecken som ingår i HTML-koderna måste skrivas som en beskrivning av tecknet.

å  =  &aring;     Å  =  &Aring;
ä  =  &auml;      Ä  =  &Auml;
ö  =  &ouml;      Ö  =  &Ouml;
"  =  &quot;      &  =  &amp;
<  =  &lt;        >  =  &gt;
ø  =  &oslash;    Ø  =  &Oslash;
&#160;  =  extra mellanslag&nbsp;  =  no breaking space 
(där det inte går med vanliga mellanslag) 

Tänk på att stor eller liten bokstav betyder olika saker.T ex a eller A i &aring;
Tillbaka till menyn

<HTML> anger att det är html-kod, den ska stå först i filen.
De flesta taggarna ska följas av en slut tagg. När man kombinerar olika taggar, kan man ta som regel att den ordningen som start taggarna ligger i ska slut taggarna ha omvänt. T ex
 .......
Så sist i filen ska det stå </HTML> (/ anger att det är en slut tagg) Skriver hädanefter bara start taggen.HTML-filen är uppdelad i två huvuddelar:HEAD och BODY Som i sin tur är uppdelade i olika delar. (Taggar)

Tillbaka till menyn

<HEAD> Är taggen för huvudet, där ska dokumentinformationen ligga.

Har tagit huvudet från en av mina sidor, det i fet stil är från huvudet och det som inte är fet stil är mina kommentarer.

<HEAD> starttagg
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> Vet jag inte säkert vad det står för.
<meta name="GENERATOR" content="Arne"> Där det står Arne kann det stå med vilket program man gjort sidan eller vem som gjort sidan:
<title>Natur bilder</title> Titeln kommer att stå längst upp på webbläsaren. Tror även att det är det som står når man söker på sökrobbotarna.
<META NAME="description" CONTENT="Arne Dykares hemsida med bl.a. naturbilder">Jag tror att det som står CONTENT=" här " är det som visas av sökrobotarna.
<META NAME="keywords" CONTENT="Arne_Dykare, html, bilder, natur, länkar,"> Dessa ord är de sökrobbotarna kollar på. De ska vara skilda åt med ,
</HEAD> Sluttagg

Titeln ( <title> ) är det enda som är obligasitoriskt.

Tillbaka till menyn

<BODY> Är kroppen där allt innehåll i sidan finns.

Innuti BODY start tagg kan man ange bakgrundsfärg, bakgrundsbild, mm.
<BODY bgcolor="#FFFFFF"> blir bakgrundsfärgen FFFFFF (det är färgen i Hexadecimala siffror)
Vad de olika färgerna har för beteckning finns på HTML på Svenska .
<BODY background="himmel.jpg" WIDTH="800" HIGHT="539" bgproperties="fixed">
himmel.jpg = bakgrundsbilden
fixed anger att bakgrundsbilden står stilla när man rullar sidan. ( Funkar ej på Netscape! )

Tillbaka till menyn

Länkar!

Länkar kan byggas upp lite olika.
<A HREF=".....">:::::</A>
..... ska ersättas med sökväg och :::::: ska ersättas med det som ska vara klickbart.

T ex <A HREF="https://arne-dykare.tripod.com/datorer/html/html.htm">HTML-koder</A>
blir så här HTML-koder , som är en länk till denna sida.

Ligger sidan du länkar till i samma bibliotek eller i under bibliotek behövs inte hela Internet adressen.
OBS! glöm inte att ute på nätet byts \ till /.
Om du istället ska gå upp ett bibliotek får du skriva ../,
.. betyder att man går tillbaka ett steg, därefter kan man lägga underbiliotek.
Ska länken vara till ett ankare skriver du #Text (t ex <A HREF="#Text">Text</A> som blir Text ), är det på en annan sida får man lägga sökvägen före #.

Där ankaret ska vara skriver du <A NAME="Html">
Denna sida har sökvägen html/html.htm
Den sida som ankaret ligger i, har sökvägen lank/utan.htm
Då blir alltså koden så här :
<A HREF="../lank/utan.htm#Html">HTML-länkar</A>
= HTML-länkar (utan.htm existerar inte nu längre.)

Det som ska vara klickbart kann bl a vara en text eller bild, ska det vara en bild, ser koden ut så här
<A HREF="bilder/jag1s.htm" TARGET="_top"><IMG SRC="jag1.jpg" WIDTH="129" HIGHT="179" ALT="34kB - LÄNK-Vem är Arne Dykare?"></A>

bilder/jag1s.htm - är målet (den filen som länken går till.)
jag1.jpg - är den klickbara bilden, där går det även att lägga sökvägen till bilden om den ligger i ett annat bibliotek.
WIDTH och HIGHT är storleken på bilden, det är inte nödvändigt att ange det, men det ska tydligen gå snabbare att öppna sidan om man anger storleken på bilden.
34kB - LÄNK-Vem är Arne Dykare? kommer upp när man låter muspekaren vila en kort stund på bilden, eller när besökaren har inställt för att inte visa bilder så får han se texten istället för tomrum.
Se även Bilder

Vill du att besökaren ska kunna maila till dig, går det att ficksa via en länk till hans mailprogram.
<A HREF="mailto:arne-dykare.nr1@telia.com">maila mig!! !!</A>
blir maila mig!! !!
mailto anger att det ska starta mailprogramet, arne-dykare.nr1@telia.com - är E-post adressen.

Vidare går det att ange TARGET, t ex
<A HREF="https://arne-dykare.tripod.com/datorer/html/html.htm" TARGET="_blank">HTML-koder</A>
Som blir ( HTML-koder ) en länk till denna sida, som öppnas i ett nytt fönster. (TARGET är mest användbart vid frames.)
_blank kann bytas ut mot _top (_parent)= ersätter allt i det aktuella fönstret, vidare kann man ange olika namn för att få länkarna att öppnas i det fönstret man vill, men det är jag inte så insatt i.

Tillbaka till menyn

Text

<PRE>               alla mellanslag     och           
 radbrytningar         som               du har i text-editorn kommer med.          
  Ända tills du skriver slut 
taggen.            (Jag har inte lyckats att formatera     
        texten emellan start och slut taggen.)</PRE>

fetstil

123 blir 12³

123 blir 12₃
Textstorleken anges med SIZE i FONT taggen (det är taggen för text) . Det fungerar med 8 storlekar:
7, 6, 5, 4, 3, 2, 1, 0
Färgen på texten anges också i FONT taggen

Här följer en bit som jag inte är säker på att det är riktigt.
<h1>TEST</h1>
blir

TEST

h1 anger att det är en rubrik, det ersätter SIZE fast siffrorna är i omvänd ordning

h6

h5

H4

h3

h2

h1

em anger teckensnitt?????
strong har jag inte upptäckt någon funktion med.

ny rad

nytt stycke (en blank rad) För denna behövs det ingen sluttagg.

Det finns flera sorters listor bl a: numrerade och punkt-listor.

Numrerade listor
<ol>
 <li>A</li>
 <li>b</li>
 <li>c</li>
 <li>D</li>
</ol>
blir

OBS! man behöver inte sätta ut numrena, det sker automatiskt.

Byter man ut <ol> mot <ul> blir det en punkt lista.

Varje <li> ger en ny rad, vill du ha en tomrad imellan punkterna i listan får du sätta ett före <li>.
<ol>
 <li>A</li>
 <li>b</li>
 <li>c</li>
 <li>D</li>
</ol>

blir

Tillbaka till menyn

Tabeller

<TR><TD>TR = Rad (Lodrätt)</TD><TD>TD = Fält (Vågrätt)</TD><TD>Fält 3</TD><TD ROWSPAN=2>ROWSPAN=så många rader sellen ska vara hög.</TD></TR>

<TR><TD>Rad2</TD><TD COLSPAN=2>COLSPAN=Så många fält sellen ska vara bred</TD></TR>
</TABLE>

TR = Rad (Lodrätt) TD = Fält (Vågrätt) Fält 3 ROWSPAN=så många rader sellen ska vara hög.
Rad2 COLSPAN=Så många fält sellen ska vara bred
4 anger hur bred ramen på tabellen ska vara. (0 = ingen ram)
80% anger hur stor del av bredden på fönstret tabellen ska vara.

Om man inte anger storleken på tabellen (med WIDTH och HIGHT) så styrs storleken av innehållet, de enskilda sellernas storlek går inte att justera. Har i följande exempel visat hur storleken av sellen styrs av de övriga sellerna.
Bredden styrs av den bredaste i det fältet och höjden av de i samma rad.

Det går att lägga bakgrundsfärg på hela tabelen, en ruta i taget, alla rutor i ett fält. Detta gör man i starttaggarna (<TABLE>, <TR>, <TD> och <TH> ), t ex <TD BGCOLOR="FFFF00"> (BGCOLOR = bakgrundsfärg)
Det går att färgsätta ramarna mad BORDERCOLOR , BORDERCOLORLIGHT och BORDERCOLORDARK, t ex <TABLE BORDERCOLOR="FFFFFF">, detta kan endast ligga i TABLE taggen.
Testa och se vilken / vilka som ger bäst resultat på din sida.

Som exempel kommer nedan först tabellen sedan visas koden.

Före varje TR har jag lagt in en blankrad och före de TD som inte sitter i hop med TR har jag lagt radbrytning, för att det ska vara lättare att se samanhanget.

Har även lagt in en del textformatering (se Text )Det är bara F som är oformaterad.

A	B	CCCCCCC	D
E	F	G	H
I	J	K	L

<TR><TD bgcolor="#CC00CC">A</TD>
<TD bgcolor="#0099CC">B</TD>
<TD>CCCCCCC</TD>
<TD>D</TD></TR>

</TABLE>

Tillbaka till menyn

Bilder

Man får testa vilket som blir minst antal kB på varje bild. I grova drag kan man säga att man använder .jpg för fotografier och .gif för ritade bilder.

För att foga in bilder <img src="bilder/2.JPG" width="599" height="397">
bilder/ är sökvägen : 2.JPG är bilden.
Width och Height har jag hört att det ska snabba på nedladdningen om det finns angivet. Det går även att använda för att manipulera bilden.
Att använda Thumbnails är för det mesta uppskattat, man gör en bild som är klickbar. Först genom ett bildbehandlingsprogram, minskar man storleken på bilden och upplösningen. (minskat antal kB = snabbare nedladdning)
Ändrar man bara WIDTH och HEIGTH så tar nedladdningen lika lång tid. (Ingen ändring i bildstorleken = samma antal kB = lika lång nedladdningstid.)
Sedan gör man bilden klickbar.
<A HREF="bilder/3.htm"><img src="3l.JPG" width="150" height="66" alt="67kB"></A>

bilder/3.htm är en HTML fil som enbart innehåller bilden i orginalutförande (30kB)
3l.JPG är den nedminskade bilden.(4kB)
Glöm inte att du måste lägga ut bägge bilderna på nätet.
Det är juste att upplysa om bildstorleken innan de påbörjar nedladdningen. T ex genom alt="67kB" , resultatet blir, när besökaren låter muspekaren vila på bilden så poppar texten 67kB upp i en liten ruta.

Mer info se Länkar
Det går att färgsätta kanterna mad BORDERCOLOR , BORDERCOLORLIGHT och BORDERCOLORDARK, t ex <img BORDERCOLOR="FFFFFF" src="bilder/2.JPG" width="599" height="397">.

Tillbaka till menyn

Färger

För koderna för de olika färgerna titta in på hemsidan HTML på svenska.. T ex FFFFFF blir vit. Koden är mängden av de tre grund färgerna i Hexadecimala siffror 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E och F.
00=min=0, 01=1, ....., 0A=10, 0B=11, ......, 10=16, 11=17, ....., 1A=26......, FF=max=255

En del hävdar att det finns 256 säkra färger, men det stämmer inte riktigt. Säkra = det ser likadant ut hos alla. Det finns de som bara visar 256 färger på deras skärmar, har de då redan öppet något fönster med någon annan färg så spricker det med 256 säkra färger.

Tillbaka till menyn

Blandat

<CENTER> Centrerar det efterföljande i fönstret

<ALIGN="center"> center går att byta ut mot right eller left. (left är standard om inte annat anges) Denna tagg går att inkludera i flertalet av andra starttaggar.

<HR> är en avgränsare

<HR COLOR="99CC00> är en färgad avgränsare ( fungerar inte för Netscape)

<HR COLOR="99CC00 WIDTH="60%"> har begränsat bredden på avgränsaren (60% = 60% av fönstret)

Tillbaka till menyn

Har ni koder som ni tycker borde vara med, ska det vara bättre förklaringar,
eller kommentarer och tips i övrigt MAILA MIG på
arne-dykare.nr1@telia.com

Till startsidan

Tillbaka till menyn

TR = Rad (Lodrätt)	TD = Fält (Vågrätt)	Fält 3	ROWSPAN=så många rader sellen ska vara hög.
Rad2	COLSPAN=Så många fält sellen ska vara bred