Differences

This shows you the differences between two versions of the page.

--- css_vg_uppgift [2012-04-03 12:53]
Joakim Forsgren created
+++ css_vg_uppgift [2022-07-18 13:20] (current)
@@ Line 6: / Line 6: @@
 ==== Uppgiften ====
-Din uppgift är att göra ett CSS-dokument med namnet ”style.css”. Denna CSS ska användas för att definiera hur bloggsidan skall formateras. Du ska inte ändra något i blogg.html; detta dokument är att betrakta som givet. Du
+Din uppgift är att göra ett CSS-dokument med namnet ”style.css”. Denna CSS ska användas för att definiera hur bloggsidan skall formateras. Du ska inte ändra något i blogg.html, detta dokument är att betrakta som givet. Du
 skall med andra ord bara skicka in filen style.css som examination.
 En godkänd inlämning skall uppfylla följande:
   * Layouten ska vara centrerad på sidan. Detta innebär att om fönstret förstoras så ska det lediga utrymmen fördelas jämt på vardera sida om innehållet. Det innebär alltså inte att texten ska vara centrerad.
-  * Layouten ska ha två kolumner. Den ena kolumnen ska innehålla en navigeringsmeny m.m. (sem mer om detta nedan) med klickbara länkar. Den andra kolumnen skall innehålla blogginläggen.Du väljer själv om navigeringsmeny skall ligga till höger eller vänster om blogginläggen.
+  * Layouten ska ha två kolumner. Den ena kolumnen ska innehålla en navigeringsmeny m.m. (se mer om detta nedan) med klickbara länkar. Den andra kolumnen skall innehålla blogginläggen.Du väljer själv om navigeringsmeny skall ligga till höger eller vänster om blogginläggen.
   * Layouten ska ha ett sidhuvud som presenteras ovanför de två kolumnerna och skall spänna över båda kolumners totala bredd.
   * Layouten ska ha en sidfot som presenteras nedanför de två kolumnerna och skall spänna över båda kolumners totala bredd.
@@ Line 25: / Line 25: @@
   * ett div-element med id ‘searchbar’ som innehåller ett enkelt webbformulär (form).
     * ett div-element med id ‘aboutme’ som innehåller en kort beskrivning av bloggar samt en bild/ikon av denna.
-ett div-element med id ‘menu’ som innehåller några allmäna länkar för bloggsystemet i form av en
+    * ett div-element med id ‘menu’ som innehåller några allmäna länkar för bloggsystemet i form av en osorterad lista (ul).
-osorterad lista (ul).
+    * ett div-element med id ‘bymonth’ för att hitta inlägg efter år och månad. Denna länkstruktur utgörs av en två-nivåers länkmenu i form av en yttre osorterade lista som har två inre osorterade listor som deldelistor.
-ett div-element med id ‘bymonth’ för att hitta inlägg efter år och månad. Denna länkstruktur utgörs
+    * ett div-element med id ‘rss’ som innehåller en länk till ett RSS-flöde.
-av en två-nivåers länkmenu i form av en yttre osorterade lista som har två inre osorterade listor som
+    * ett div-element med id ‘calendar’ som innehåller en kalender för maj månad i form av en tabell.
-deldelistor.
+    * ett div-element med id ‘articles’ som innehåller tre stycken blogginlägg. Varje blogginlägg är strukturerat som dett div element av klassen ’article’. En sådan div innehåller en rubrik, ett datum och tid för inlägget samt själva inläggets text i form av en eller flera p-element. Ett av inläggen har också två kommentarer som utgörs av div-element av klassen ‘comment’ som i sig innehåller en rubrik, datum och tid samt kommentarstexten i form av ett p-element.
-ett div-element med id ‘rss’ som innehåller en länk till ett RSS-flöde.
+    * ett div-element med id ‘footer’ som utgör sidans sidfot som innehåller ett p-element.
-ett div-element med id ‘calendar’ som innehåller en kalender för maj månad i form av en tabell.
-ett div-element med id ‘articles’ som innehåller tre stycken blogginlägg. Varje blogginlägg är strukturerat
-som dett div element av klassen ’article’. En sådan div innehåller en rubrik, ett datum och tid för inlägget
-samt själva inläggets text i form av en eller flera p-element. Ett av inläggen har också två kommentarer
-som utgörs av div-element av klassen ‘comment’ som i sig innehåller en rubrik, datum och tid samt
-kommentarstexten i form av ett p-element.
-ett div-element med id ‘footer’ som utgör sidans sidfot som innehåller ett p-element.
 Det är viktigt att du studerar xhtml-dokumentets uppbyggnad och vilka olika id och klasser som används.
-Inlämning
+==== Resurser ====
+{{::blogg.zip|}} och ett {{::blogg.png?linkonly|ex}} på vad som minst krävs för godkänd uppgift.
+==== Inlämning ====
 Du skall lämna in ditt css-dokument style.css.
-Om du vill använda bilder utöver det som är givet, som bakgrunder för olika element måste dessa bilder länkas in
-ifrån CSS-dokumentet. Du måste då också packa ihop CSS-filen samt dessa bilder i en zip-fil. Här är kravet att
-dessa bilder skall placeraras i style-mappen, d.v.s. samma mapp som css-filen ligger i.
+Om du vill använda bilder utöver det som är givet, som bakgrunder för olika element måste dessa bilder länkas in ifrån CSS-dokumentet. Du måste då också packa ihop CSS-filen samt dessa bilder i en zip-fil. Här är kravet att dessa bilder skall placeraras i style-mappen, d.v.s. samma mapp som css-filen ligger i.