Kmom04: CSS och en styleväljare

By . Latest revision .

Vi tillägnar detta kursmoment åt att gå igenom fler grunder i CSS, grunder såsom boxmodellen, storlekar, display, float, fonter, färger och bakgrund. Du får möjligheten att leka runt och testa olika konstruktioner. Det är ett bra sätt att lära sig.

Avslutningsvis gör vi en programmeringsövning där vi skapar en stylesheetväljare med PHP. Med den kan vi dynamiskt ändra vilken stylesheet som används till webbplatsen. I samband med det så tittar vi på lite fler PHP-konstruktioner som sessioner och postade formulär.

Dessutom gör du en labb för att komma igång med funktioner i PHP. Allt eftersom koden växer så ökar behovet av att strukturera koden och funktioner är en viktig del för att strukturera kod.

En styleväljare på Mikaels me-sida.

Här kan du testa exemplet som ligger till grund för resultatet, du hittar det i kursrepot på dbwebb.

(Detta är instruktionen för kursmomentet och omfattar det som skall göras inom ramen för kursmomentet. Momentet omfattar cirka 20 studietimmar inklusive läsning, arbete med övningar och uppgifter, felsökning, problemlösning, redovisning och eftertanke. Läs igenom hela kursmomentet innan du börjar jobba. Om möjligt – planera och prioritera var du vill lägga tiden.)

#Läsanvisningar

(ca: 4-6 studietimmar)

#Kurslitteratur

Läs följande:

  1. HTML och CSS-boken

    • Kapitel 9 Formulär
    • Kapitel 10 Avancerad CSS
  2. Webbutveckling med PHP och MySQL

    • Kapitel 7 Funktioner

#Artiklar

Läs följande:

  1. Del 16-19 av Kom i gång med PHP på 20 steg

#Video

Titta på följande:

  1. Videoserien Lär dig PHP är tätt kopplat till kursmaterialet. Kika på de videor som börjar med 4.

#Lästips

Följande lästips hjälper dig att hitta relevant information.

  1. Se en översikt av olika formulärelement.

#Övningar & Uppgifter

(ca: 8-12 studietimmar)

#Övningar

Genomför följande övningar.

  1. Jobba igenom övningen “Vanliga CSS-konstruktioner som är bra att kunna”.

  2. Jobba igenom övningen “Att bygga en styleväljare till sin webbplats”.

#Uppgifter

Dessa uppgifter skall utföras och redovisas.

  1. Gör uppgiften “PHP lab 4: skapa egna funktioner”. Spara alla filerna i katalogen me/kmom04/lab4.

  2. Gör uppgiften “Bygg en styleväljare till din webbplats”. Spara filerna i me/kmom04/stylechooser.

  3. Gör uppgiften “Bygg ut din me-sida till version 4”. Spara filerna i katalogen me/kmom04/me4.

#Extra

Det finns inga extra uppgifter.

#Resultat & Redovisning

(ca: 1-2 studietimmar)

Läs instruktionen om hur du skall redovisa.

Se till att följande frågor besvaras i redovisningstexten.

  • Börjar du känna att du bemästrar CSS? Beskriv hur väl du kan CSS (nybörjare, erfaren).
  • Vad tycker du om CSS så här långt in i kursen?
  • Hur lyckades du med din styleväljare, var det svårt?
  • Det var ju både formulär, sessioner, POST, GET och lite till, hur kändes det?
  • Hur tänkte du när du gjorde din extra stylesheet och vad tycker du om resultatet?
  • Hur går det med ditt PHP:ande, börjar det bli mycket/svår kod, eller går det finfint?
  • Gjorde du någon av extrauppgifterna? Berätta om det arbetet i så fall.

#Revision history

  • 2017-06-15: (E, mos) Uppdaterad labbserie.
  • 2016-08-31: (D, mos) Lade till rätt videoserie från youtube.
  • 2016-02-22: (C, mos) Bort med not om kursutveckling och länk till version 1.
  • 2015-08-25: (B, mos) Genomgången och första versionen släppt.
  • 2015-06-03: (A, mos) Första utgåvan för htmlphp version 2 av kursen.

Document source.