Hur man gör en enkel hemsida
HTML-koder
Länkar
Carins webbsida
Webmaster
Copyright © 2018,
Carin Olofsson
Senast uppdaterad:
6 november 2018
|
|
Efter exemplen har jag skrivit hur HTML-koden ser ut.
Om du vill slippa skriva hela koden själv kan du kopiera den direkt från den här sidan. Markera texten med koderna genom att hålla ner vänster musknapp och dra musen över texten så långt du vill kopiera den. Tryck sedan Ctrl-C för att kopiera texten. Öppna Anteckningar eller WordPad och tryck Ctrl-V för att klistra in texten.
För att se hur kodningen av ett dokument är gjord, välj View Document source (eller View Frame source om dokumentet har ramar) om du använder Netscape. Välj Visa Källa om du använder Internet Explorer. Du kan också spara dokumentet som HTML-dokument och titta på det i en texteditor (som till exempel Anteckningar eller WordPad).
Om du vill göra en anteckning för eget bruk på din sida kan du använda följande kod:
<!--Detta är en kommentar-->
Texten syns inte på sidan, men du kan läsa den i koden. Detta är till hjälp om du vill kommentera de olika delarna i dina sidor.
Så här namnger du olika områden i ditt dokument, för att enkelt förflytta dig mellan olika delar av dokumentet.
Börja med att namnge ett område. Detta skapar en länk till området någon annanstans i texten (men det är fortfarande på samma sida).
Så här namnger du områden i ditt dokument
Kod: <A HREF="#namnge">Så här namnger du områden i ditt dokument</A>
Sedan måste du ange var området börjar.
Namnge områden i ditt dokument
Kod: <A NAME="namnge">Namnge områden i ditt dokument</A>
Så här skriver man fet stil och kursiv stil
Kod: <B>fet</B> och <I>kursiv</I>
Så här skriver man citerad text.
Kod: <CITE>citerad</CITE>
Det här är typografisk emfas i en text.
Kod: <EM>typografisk emfas</EM>
Det här är stark typografisk emfas i en text.
Kod: <STRONG>stark typografisk emfas</STRONG>
Här är några olika metoder för att åstadkomma marginaler på websidan:
Genom att använda "BLOCKQUOTE" så kan man skapa marginaler till höger och till vänster. Detta är bra om man vill ha lite mer lättlästa stycken.
Kod: <BLOCKQUOTE>Här skriver du texten.</BLOCKQUOTE>
Genom att använda "UL", men utan "LI", får man också marginaler på texten, dock bara vänstermarginal. Du kan skriva in så långa texter du vill på det här sättet.
Kod: <UL>Här skriver du texten.</UL>
Slutligen kan man använda "TABLE" och sätta BORDER=0. Välj hur bred vänstermarginalen skall vara genom att sätta valfritt tal på "CELLSPACING", t.ex. som här där CELLSPACING=30. Nackdelen är att det tar längre tid att ladda hem sidorna när man använder tabellformat. Dessutom blir det stora mellanrum före och efter tabellen. Ju större tal som används till CELLSPACING desto större blir mellanrummet.
Kod: <TABLE BORDER=0 CELLSPACING=30><TR>
<TD ALIGN="LEFT">Här skriver du texten.
</TD> </TR></TABLE>
|
Detta är exempel på en menylista (mer kompakt
än vanliga listor):
Mina favoritkattraser
Kod:
<MENU COMPACT>
<LI>Text</LI>
<LI>Etc...</LI>
</MENU>
Detta är exempel på en ickeordnad lista:
Fördelarna med ickeordnade listor
- Man kan lägga till så många punkter som behövs.
- Man kan lägga till punkterna i vilken ordning som helst.
- Texten kan vara kort.
- Eller också kan texten vara så lång att den sträcker sig över flera rader och då är det risk för att läsaren tröttnar på innehållet och väljer att titta på något annat istället. Därför är det nog en fördel att vara kortfattad när man skriver listor.
- ... man kan lägga till fler punkter efterhand.
Kod:
<UL>
<LI>Text</LI>
<LI>Etc...</LI>
</UL>
Detta är exempel på en numrerad lista:
Mina tre favoritkattraser
- Europeisk korthår
- Norsk skogkatt
- Maine coon
Kod:
<OL>
<LI>Text</LI>
<LI>Etc...</LI>
</OL>
Så här infogar du en ljudfil på din sida:
|
|