msb-public
/
Web-Dev-For-Beginners
mirror of https://github.com/microsoft/Web-Dev-For-Beginners.git
1
0
Code Issues Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '5fb78cc2d1'
${ noResults }
Web-Dev-For-Beginners/translations/sv/3-terrarium/2-intro-to-css/assignment.md

2.9 KiB
Raw Blame History Escape

CSS-omstruktureringsuppgift

Syfte

Omstrukturera terrariumprojektet för att använda Flexbox eller CSS Grid för layout. Uppdatera HTML och CSS vid behov för att uppnå en modern, responsiv design. Du behöver inte implementera dragbara element – fokusera endast på layout och styling.

Instruktioner

  1. Skapa en ny version av terrarium-appen. Uppdatera HTML och CSS för att använda Flexbox eller CSS Grid för layout.
  2. Säkerställ att konsten och elementen är på plats som i den ursprungliga versionen.
  3. Testa din design i minst två olika webbläsare (t.ex. Chrome, Firefox, Edge).
  4. Ta skärmdumpar av ditt terrarium i varje webbläsare för att visa kompatibilitet mellan webbläsare.
  5. Skicka in din uppdaterade kod och skärmdumpar.

Bedömningskriterier

Kriterier Exemplariskt Tillräckligt Behöver förbättras
Layout Fullständigt omstrukturerad med Flexbox eller CSS Grid; visuellt tilltalande och responsiv Vissa element omstrukturerade; delvis användning av Flexbox eller Grid Lite eller ingen användning av Flexbox eller Grid; layout oförändrad
Kompatibilitet mellan webbläsare Skärmdumpar tillhandahållna för flera webbläsare; konsekvent utseende Skärmdumpar för en webbläsare; mindre inkonsekvenser Inga skärmdumpar eller stora inkonsekvenser
Kodkvalitet Ren, välorganiserad HTML/CSS; tydliga kommentarer Viss organisation; få kommentarer Oorganiserad kod; saknar kommentarer

Tips

  • Granska Flexbox och CSS Grid guider.
  • Använd webbläsarens utvecklingsverktyg för att testa responsivitet.
  • Kommentera din kod för tydlighet.

Ansvarsfriskrivning:
Detta dokument har översatts med hjälp av AI-översättningstjänsten Co-op Translator. Även om vi strävar efter noggrannhet, bör det noteras att automatiska översättningar kan innehålla fel eller felaktigheter. Det ursprungliga dokumentet på dess originalspråk bör betraktas som den auktoritativa källan. För kritisk information rekommenderas professionell mänsklig översättning. Vi ansvarar inte för eventuella missförstånd eller feltolkningar som uppstår vid användning av denna översättning.