<<Listor och Länkar>>
- Skapa en punktlista (unordered list) med alla delar man behöver köpa in för att bygga en egen hemmabyggd dator.
- Skapa en definitionslista (definition list) som förklarar vad dessa komponenter i en dator har för uppgift.
- Gör en nummrerad lista (numbered list eller ordered list) som beskriver i vilken ordning saker och ting ska monteras.
- Här ska du också lägga in nästlade listor (nested lists, se sid 68) för att göra det tydligt hur man ska montera saker.
- Den här punkten (och nästa) är ett exempel på en nästlad lista...
- ...eftersom den ligger innuti en annan lista.
- Men du ska inte se punkter, du ska se nummer i både första listan och den inuti.
- Här ska du också lägga in nästlade listor (nested lists, se sid 68) för att göra det tydligt hur man ska montera saker.
- Skapa en filstruktur liknande den på bild 1. Du kan skapa dessa mappar och filer direkt i din webeditor eller i utforskaren beroende på vad du tycker är lättast. Varje html-sida du skapar ska bestå av en rubrik och en kort text om vad sidan handlar om. Du ska för varje länk visa/skriva ut sökvägen som du skriver för att hitta till din sida samt förklara hur du länkar enligt punkterna här nedanför.
- Länkar till egna sidor i undermappar.(relativa länkar)
- Länkar till sidor i mappar onvanför den mapp du länkar från.(relativa länkar)
- Direktlänkar till webbsidor med absoluta adresser. (till exempel Star Wars filmer på imdb: https://www.imdb.com/list/ls070150896/)
- Länkar till andra delar på samma sida (se sid 87-88). För att göra detta så skapa en sida med ett långt innehåll (kopiera text från wikipedia eller använd (
lorem200+) i dreamweaver för att skapa 200 ord med nonsenstext. Sätt sedan rubrik-taggar som du ger attributet id med valfritt namn på. Då kan du länka till dessa så att sidan scrollas till valfritt id. Sätt in ett flertal olika och se till att det syns att man kommer till olika platser i dokumentet(hemsidan).
- Visa att du förstår hur man länkar så att länken öppnas i samma fönster eller i ett nytt fönster (ny flik).
I den här uppgiften ska vi först öva på några olika typer av listor i HTML. Därefter ska vi öva på att länka mellan olika sidor. Du får vägledning till hur dessa uppgifter ska lösas genom att läsa kapitel 3 och 4 i läroboken.
Punktlistor är listor som har en liten figur framför sig. Normalt sett så är detta en fylld cirkel men det går att byta symbol till andra symboler eller till och med en egen bild om man vill.
Numrerade listor har istället för en punkt ett nummer som beskriver i vilken ordning listobjektet i listan har. Detta nummer räknas upp automatiskt ju fler listelement som läggs till i listan. Normalt sett så används vanliga nummer, men senare (i CSS) så kan man välja att visa romerska nummer eller bokstäver (i bokstavsordning) på sina numrerade listor.
En definitionslista har en definitions-term som kan liknas med en rubrik på vad som ska listas och efter den så kommer definitionen av den termen. Den här typen av listor används vanligtvis när man ska beskriva flera olika saker eller ord.
Du ska skapa en hemsida (välj ett lämpligt namn på din fil som t.ex. uppgift2.html). På den sidan så ska du visa att du kan skapa följande listor:
För att öva på att skapa interna länkar så måste du först skapa en mappstruktur och i dessa mappar skapa nya html-sidor. Därefter kan du länka till och från dessa sidor. Du ska kunna visa att du behärskar att länka både inom din egen filstruktur samt utanför din egen domän. Varje HTML-sida du skapar ska alltså länka till ett flertal av dessa andra sidor.
Använd dina skapade sidor för att förklara vad som menas med relativa och absoluta länkar samt hur man öppnar länkar i samma fönster eller nya flikar.
Glöm inte bort att länka tillbaka till din startsida och att länka från startsidan till den här uppgiften. När du är klar postar du länken till din uppgiftssida i classroom.