Inhalte

[et_pb_section fb_built=“1″ _builder_version=“4.10.7″ _module_preset=“default“ background_color=“RGBA(0,0,0,0)“ global_colors_info=“{}“][et_pb_row _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_column type=“4_4″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text _builder_version=“4.10.7″ _module_preset=“default“ background_color=“#EDE3D3″ custom_padding=“10px|10px|10px|10px|false|false“ box_shadow_style=“preset2″ global_colors_info=“{}“]

In diesem Repository werde ich die Übungen, die wir gemeinsam machen und auch ggf später Lösungen zum Download zur Verfügung stellen: https://github.com/RebiRotti/abendkurs-2021/

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“Nachschlagenseiten“ _builder_version=“4.11.2″ _module_preset=“default“ background_color=“#EDE3D3″ custom_padding=“10px|10px|10px|10px|false|false“ box_shadow_style=“preset2″ global_colors_info=“{}“]

Nachschlagenseiten

nützliche Browserplugins

  • Wappalyzer – Interested to know which websites use certain technologies?

Farbpicker

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text _builder_version=“4.10.7″ _module_preset=“default“ background_color=“#EDE3D3″ custom_padding=“10px|10px|10px|10px|false|false“ box_shadow_style=“preset2″ global_colors_info=“{}“]

Praktische Links

Bilder, Icons

Spielerisch Lernen

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ border_width_top=“1px“ border_color_top=“#444444″ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“16. + 18.09.2021″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

16. + 18.09.2021

  • Kapitel 01 – Ziemlich beste Freunde: HTML und CSS
  • Kapitel 02 – Beispiel für das HTML/CSS-Team
    • Gestatten: die Beispielsite
    • Der HTML-Code für die Beispielseite
    • Einmal Gestaltung bitte – CSS-Code erklärt
  • Kapitel 03 – Fremden Code untersuchen, eigenen besser verstehen
  • Kapitel 04 – Ab ins Internet (self study)
    • Grundprinzip verstehen
    • Hosting – Begriffe und Fakten
    • Fehler beheben und Probleme lösen
  • Kapitel 05 – Gut strukturiert ist halb gewonnen
    • Kopf und Rumpf
      • Sprachangabe
      • Zeichensatzangabe UTF-8
      • Seitentitel – aber richtig
    • Grundlegende Techniken
    • Texte unterteilen
    • Inline-Elemente
  • Kapitel 06 – Bilder
    • Mehr als Worte: Bilder
      • Raster versus Vektor
      • Eine Frage des (Bild-)Formats
      • Das richtige Format für die richtige Situation
      • Bilder einbinden
  • Kapitel 07 – Links und Pfade
    • Verlinkungen
      • An bestimmte Stellen auf Seiten verlinken
  • Kapitel 09 – HTML mit CSS zusammenbringen
    • HTML und CSS verknüpfen
      • Externe Datei
  • Kapitel 11 – Schriften, Absätze und Listen formatieren
    • Schrift formatieren
      • Webfonts
    • Listen formatieren
  • Kapitel 13 – Hintergrundbilder
    • Hintergrundfarben und -bilder
    • Bildschirmfüllendes Hintergrundbild
  • Kapitel 15 – Flexbox
    • Flexbox für Layouts und Navigationsleisten

 

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“]

Einstieg

Flexbox

 

Weitere Info

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ border_width_top=“1px“ border_color_top=“#444444″ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“25.09.2021″ _builder_version=“4.10.7″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

23.09.2021

  • Kapitel 02 – Beispiel für das HTML/CSS-Team
    • Anpassungen für kleine Screens
  • Kapitel 05 – Gut strukturiert ist halb gewonnen
    • Kopf und Rumpf
      • Mehr meta
    • Struktur im Groben
  • Kapitel 06 – Videos
    • Mehr als Worte: Bilder
    • Bewegt: Videos
    • iframes: die guten Frames
    • Was auf die Ohren: Audio
    • Mehr Objekte
  • Kapitel 07 – Links und Pfade
    • Verlinkungen
    • Pfade – von hier nach dort und wieder zurück
  • Kapitel 08 – Formulare (Teil 1 input-Felder)
    • Von der Wiege bis zur Bahre – Formulare, Formulare

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“]

Querverweise

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ border_width_top=“1px“ border_color_top=“#444444″ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“25.09.2021″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

25.09.2021

 

  • Kapitel 08 – Formulare

     

    • Von der Wiege bis zur Bahre – Formulare, Formulare
  • Kapitel 09 – HTML mit CSS zusammenbringen
    • HTML und CSS verknüpfen
      • Eingebettete Stylesheets
      • Inline-Stile
      • Externe Stylesheets mit @import einbinden
    • Kommentare – in CSS (im Unterschied zu HTML)
    • Die Qual der Wahl – Elemente auswählen
    • Das Recht des Stärken – Spezifität verstehen
  • Kapitel 10 – CSS: Farben, Maßeinheiten und Vererbung
  • Kapitel 11 – Schriften, Absätze und Listen formatieren

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“]

Farben

[/et_pb_text][et_pb_text _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“]

Querverweise

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ border_width_top=“1px“ border_color_top=“#444444″ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“09.10.2021″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

09.10.2021

[/et_pb_text][et_pb_text admin_label=“09.10.2021″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

  • Kapitel 08 – Tabellen
    • Informationen in Reih und Glied – Tabellen
      • Grundlegender Aufbau von Tabellen
      • Tabellen fehlerfrei erstellen
      • Weitere Strukturierungselemente bei Tabellen
  • Kapitel 13 – Farbverläufe
    • Farbverläufe erstellen
      • Grundprinzip von Farbverläufen
      • Code für ältere Browser
      • Variationen für Farbverläufe

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text _builder_version=“4.11.2″ _module_preset=“default“ global_colors_info=“{}“]

Querverweise

Tabellen

CSS Grundlagen

Farbverläufe

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ border_width_top=“1px“ border_color_top=“#444444″ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“14.10.2021″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

14.10.2021

[/et_pb_text][et_pb_text disabled_on=“off|off|off“ admin_label=“14.10.2021″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

  • Kapitel 12 – Kästchen messen
  • Kapitel 15 – Gridlayout
    • Rasterlayouts leicht gemacht mit Gridlayout
      • Erstes Raster
      • Gridlayout mit benannten Bereichen
      • Voll flexibles Raster
      • Ausrichten mit Gridlayout und Abstände zwischen Rasterzellen
  • Kapitel 16  – Responsives Webdesign
  • Kapitel 17 – Responsive Bilder

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text disabled_on=“off|off|off“ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

Querverweise

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ border_width_top=“1px“ border_color_top=“#444444″ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“16.10.2021″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

16.10.2021

[/et_pb_text][et_pb_text disabled_on=“off|off|off“ admin_label=“16.10.2021″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

Einführung in JavaScirpt

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text disabled_on=“off|off|off“ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

 CSS

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ border_width_top=“1px“ border_color_top=“#444444″ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“21.10.2021″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

21.10.2021

[/et_pb_text][et_pb_text disabled_on=“off|off|off“ admin_label=“21.10.2021″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

Funktionen mit Übergabe- und Rückgabeparameter, Schleifen

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text disabled_on=“off|off|off“ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

Querverweise

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ border_width_top=“1px“ border_color_top=“#444444″ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“12.02.2022″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

12.02.2022

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text disabled_on=“off|off|off“ _builder_version=“4.14.7″ _module_preset=“default“ hover_enabled=“0″ border_color_top=“#444444″ global_colors_info=“{}“ sticky_enabled=“0″]

Querverweise

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ border_width_top=“1px“ border_color_top=“#444444″ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“19.02.2022″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

19.02.2022

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text disabled_on=“on|on|on“ _builder_version=“4.14.7″ _module_preset=“default“ hover_enabled=“0″ border_color_top=“#444444″ global_colors_info=“{}“ sticky_enabled=“0″ disabled=“on“]

Querverweise

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ border_width_top=“1px“ border_color_top=“#444444″ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“26.02.2022″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

26.02.2022

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ border_width_top=“1px“ border_color_top=“#444444″ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“05.03.2022″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

05.03.2022

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][/et_pb_column][/et_pb_row][et_pb_row column_structure=“1_2,1_2″ _builder_version=“4.10.7″ _module_preset=“default“ border_width_top=“1px“ border_color_top=“#444444″ global_colors_info=“{}“][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][et_pb_text admin_label=“12.03.2022″ _builder_version=“4.11.2″ _module_preset=“default“ border_color_top=“#444444″ global_colors_info=“{}“]

12.03.2022

Start Vertiefung

[/et_pb_text][/et_pb_column][et_pb_column type=“1_2″ _builder_version=“4.10.7″ _module_preset=“default“ global_colors_info=“{}“][/et_pb_column][/et_pb_row][/et_pb_section]