Neuseelandreise CSS Quiz
Analysiert die CSS Regeln in main.css
- Zeit: 30 Minuten
- Dreierteams
- Hilfsmittel
- alles, in den CSS Tutorials der Codecademy Gelernte ;-)
- Tooltips in VSCode sowie die von dort verlinkte MDN-Referenz
- einfach ausprobieren: Werte (stark) ändern, Regeln ungültig machen und schauen was passiert …
- das Internet …
… bevor ihr loslegt
Ladet main.css herunter und bindet es im <head> Bereich von index.html
mit einem <link> Element als externes Stylesheet main.css
in eure Etappe ein - damit sieht eure Etappe nicht nur viel besser aus, sondern ihr könnt auch optisch nachvollziehen, was die einzelnen Regeln bewirken …
Folgende Fragen sollen beantwortet werden
- was bewirkt die CSS Regel in Zeile 5-10?
- wozu wird das Größerzeichen (
>
) in Zeile 12 verwendet?
- was passiert in der CSS Regel in Zeile 16-21?
- was passiert in der CSS Regel in Zeile 23-30?
- was bewirkt
padding
in Zeile 33?
- wo werden die Fonts Roboto und Montserrat in Zeile 37 & Zeile 45 definiert?
- findet die Quelle aller verwendeten Fonts im Internet
- warum steht eine Raute (
#
) vor map
in Zeile 52?
- wofür stehen die vier Werte bei
padding
in Zeile 61?
- was bewirkt die CSS Regel in Zeile 64-67?
- welche Elemente werden mit dem Schatten in Zeile 76-78 angesprochen?
- was bewirkt die
@media
Regel in Zeile 81-90? Könnt ihr sie im Browser reproduzieren?