Web - Übung 1, HTML & CSS

From Coders.Bay Wiki
Jump to navigation Jump to search

Erstelle zwei Seiten die miteinander verlinkt sind.
Wähle das Thema selbst.
Versuche zwei Article-Bereiche in einem Main nebeneinander darzustellen.
Binde Bilder ein und achte darauf, dass du keinen horizontalen Scrollbalken erhältst (dh sie sollen responsive sein)
Kopier dir Text von Wikipedia raus oder generier dir einen lustigen Text unter: Blindtext Generator Webdesigner

Vergiss nicht auf die Navigation und den Footer

folgende HTML Tags haben wir kennen gelernt:[edit]

  • header
  • nav
  • ul
  • li
  • h1
  • main
  • article
  • h2
  • p
  • a
  • img
  • footer

folgende CSS Anweisungen haben wir gesehen:[edit]

  • margin für den Außenabstand
  • font-size = Schriftgröße
  • font-family = Schriftfamilie
  • line-height = Zeilenhöhe
  • background-color = Hintergrundfarbe
  • list-style = Listen Styling
  • padding = Innenabstand
  • display: flex und display: block (Erklärung hierzu folgt noch)
  • color = Schriftfarbe
  • text-decoration = Text unterstreichen, durchstreichen, usw.
  • text-align = Ausrichtung von Text
  • @media screen and (max-width: 720px) {} = Breakpoint
  • width = Breite eines Elements
  • max-width = maximale Breite eines Elements

Zusätzliche Stylings[edit]

  • border-radius
  • border = braucht drei Angaben: Breite, Aussehen und Farbe
  • box-shadow = braucht drei px Angaben (Versatz auf der Horizontalen, Versatz auf der Vertikalen, Radius des Blurs) und Farbe