modul:m287:learningunits:lu04:aufgaben:grid

Dies ist eine alte Version des Dokuments!


LU04.A02 - Grid

  1. Was bewirkt die CSS-Eigenschaft display: grid?
  2. Was ist der Unterschied zwischen einem Grid-Container und einem Grid-Item?
  3. Wofür stehen die Einheiten fr und px in CSS Grid?
  4. Wie viele Dimensionen unterstützt CSS Grid?
  5. Was passiert, wenn Sie grid-template-columns: 1fr 2fr setzen?
  6. Wie sieht die Kurzform für grid-column-start und grid-column-end aus?

HTML

<!-- HTML -->
<div class="grid">
  <div>Box 1</div>
  <div>Box 2</div>
  <div>Box 3</div>
  <div>Box 4</div>
  <div>Box 5</div>
  <div>Box 6</div>
</div>
  1. Setzen Sie display: grid auf .grid
  2. Erstelle 3 Spalten und 2 Zeilen
  3. Geben Sie jeder Box eine andere Hintergrundfarbe
  • modul/m287/learningunits/lu04/aufgaben/grid.1743144323.txt.gz
  • Zuletzt geändert: 2025/03/28 07:45
  • von kdemirci