Mitschrift HTML. Dateinamen von Bildern: nur Kleinbuchstaben ohne Umlaute und Sonderzeichen BSP: auto.jpg fruehling.jpg bild_01.

Save this PDF as:
 WORD  PNG  TXT  JPG

Größe: px
Ab Seite anzeigen:

Download "Mitschrift HTML. Dateinamen von Bildern: nur Kleinbuchstaben ohne Umlaute und Sonderzeichen BSP: auto.jpg fruehling.jpg bild_01."

Transkript

1 1. Stunde Mitschrift HTML Bildbearbeitung in Hinblick auf HTML. Dateinamen von Bildern: nur Kleinbuchstaben ohne Umlaute und Sonderzeichen BSP: auto.jpg fruehling.jpg bild_01.jpg Verstehen des Unterschiedes der Bildansicht in Prozent und der tatsächlichen Bildgröße. 100% ist immer die wahre Größe. In dieser Größe werden Bilder in HTML gerendert, wenn der OUTPUT des Bildes nicht gesondert definiert ist. GIMP: Bilder in genauen Pixel Größen speichern können. Bild * Bild skalieren: Unter diesem Menüpunkt kannst du die Bildgröße verändern. Beachte die Bildproportionen Arbeiten mit dem Zuschneiden Werkzeug: Möglichkeit, Ausschnitte von Bildern herzustellen Ziel: Speichere 3 beliebige Bilder (Fotos) auf deinem Desktop. Schneide sie entsprechend zu und speichere sie mit der Pixelgröße 500 x 150 PIXEL. HÜ: Speichere 5 Fotos aus dem Internet auf deinem Desktop. Speichere sie unter den Namen 1.jpg, 2.jpg, 3.jpg, 4.jpg, 5.jpg Schneide alle Fotos zu quadratischen Bildern zu und setze sie auf eine Größe von 150 x 150 Pixel Seite 1 von 13

2 2. Stunde Aufgabe: Fertige 3 Bilder (200 x 200 PIXEL) quadratisch von 3 verschiedenen Tieren an. Achte auf das Verzerren, schneide die Bilder so zu, dass im Wesentlichen nur das Tier sichtbar ist. Erste Schritte in HTML: Arbeiten im Editor PsPad und Browser (Ansehen und Aktualisieren) Aufbau einer Internetseite Erlernen der ersten einfachen Befehle (TAG s) Mitschrift in Form einer Art Vokabelheft <html> <title> <body> <table> <tr> <td> width <p> html Tag steht zu Beginn jeder Internetseite Definiert den Namen der Seite. Ersichtlich in Browser-Adresszeile Das body Element enthält den gesamten Inhalt eines HTML Dokuments wie Texte, Hyperlinks, Fotos, Tabellen, Listen, Öffnet eine Tabelle Zeile einer Tabelle Spalte einer Tabelle Diese Eigenschaft definiert die Breite eines Elements. Kann in Pixel oder Prozent definiert werden. Bestimmt einen Absatz (Enter Taste) im HTML Dokument HÜ: Mit den kennengelernten Mitteln eine Seite programmieren. Die Seite soll eine Tabelle mit 3 Spalten und mindestens 3 Zeilen beinhalten. Seite 2 von 13

3 3. Stunde Aufgabe: Programmiere eine Seite mit <title> und einer Tabelle mit 2 Zeilen und je 4 Spalten. Füge darauf Fotos ein. Definiere den Rahmen mit der Rahmenlinienstärke 1. Neue TAG s <br> border img src Setzt einen Zeilenumbruch auf die Seite (Shift Enter) Definiert die Eigenschaft eines Rahmens Fügt Bilder oder Fotos ein Struktur und Aufbau einer Tabellenprogrammierung mit Bildereinfügung Aufbau einer Tabelle mit 2 Zeilen und jeweils 4 Spalten: Die Tabelle hat die Zusatzeigenschaft border= 1 und width= 100% border= 1 border= 0 width= 100% bedeutet: Sichtbarer Rahmen bedeutet: kein sichtbarer Rahmen bedeutet eine Bildschirmausdehnung über die gesamte Bildschirmbreite Seite 3 von 13

4 4. Stunde Aufgabe: Programmiere eine Seite in der du externe Hyperlinks einbaust. Neue TAG s a href= align target Definiert einen Hyperlink Definiert die Ausrichtung eines Elements (left, right, center) Definiert, wie die aufgerufene Seite geöffnet wird. Das Beispiel zeigt: einen Hyperlink auf die Seite Außerdem wird der Hyperlink in einem neuen Browser Fenster geladen. Angezeigter Name am HTML Dokument ist ORF target= blank align= center width= 400px bedeutet: Seite wird in neuem Browser Fenster geladen bedeutet: Textausrichtung zentriert bedeutet, dass das Element 400 PIXEL breit dargestellt wird Seite 4 von 13

5 5. Stunde Aufgabe: Programmiere eine Seite in der du interne Hyperlinks einbaust. Beschreibung der Vorgangsweise: Erstelle in einem Ordner 3 HTML-Dateien mit folgenden Namen index.htm freunde.htm schule.htm Programmiere die 3 Dateien. Verwende Tabellen, baue Bilder und externe LINKS ein. Verlinke die 3 Dateien untereinander (interner LINK) index.htm Einfache Tabelle mit 2 Spalten in einer Zeile mit internen LINKS. Die LINKS verzweigen auf die Datei freunde.htm bzw. schule.htm freunde.htm Einfache Tabelle mit 2 Spalten in einer Zeile mit Textinhalt bzw. Anzeige einer Graphik. Darunter ist ein interner LINK definiert, der zur Hauptseite index.htm zurück verweist. Seite 5 von 13

6 Darstellung mit graphischer Erläuterung: freunde.htm index.htm Meine Freunde Das sind meine Freunde, zurück Startseite meine Freunde meine Schule schule.htm Meine Schule Das ist meine Schule zurück Diese 3 Dateien sind intern geschlossen miteinander verlinkt. In den nachfolgenden Kapiteln ist dieses Verständnis die Basis zur Menüerstellung. Hausübung: Programmiere eine Startseite index.htm mit 3 internen LINKS zu selbst definierten Seiten. Du kannst dich auch an folgendem Beispiel orientieren. sport.htm index.htm hobby.htm musik.htm Programmiere in jeder deiner 3 Seiten (sport.htm, hobby.htm, musik.htm) einen zurück LINK auf die Datei index.htm ein. Gestalte deine Seiten mit Tabellen, Fotos, Texten bzw. externen LINKS Seite 6 von 13

7 6. Stunde Aufgabe: LINK auf Graphiken bzw. Textteile setzen können. Den programmtechnischen Unterschied erarbeiten bzw. kennen lernen, einen Hyperlink auf Graphiken oder Textteile setzen können. Das folgende Beispiel zeigt eine Tabelle (1 Zeile 2 Spalten) mit je 2 LINKS. Der erste LINK verweist zur Seite und ist auf die Graphik auto.jpg gesetzt. Der zweite LINK verweist mit dem Wort ORF zur Seite und Übung: Programmiere eine Internetseite (start.htm) in welcher du 3 Bilder einbaust. Auf jedes Bild soll ein Hyperlink programmiert werden, der dich zu einer anderen Seite weiterführt. Verwende dazu 3 externe LINKS. Richtlinien zum Programmieren: Bearbeite die Bilder so, dass sie alle gleich groß sind. (150 x 100 PIXEL) Verwende eine Tabelle (Breite der Tabelle 500 px, Rahmen sichtbar) Erste Spaltenbreite = 200 px Zweite Spaltenbreite = 300 px Richte Fotos und Text zentriert aus Seite 7 von 13

8 7. Stunde Aufgabe: Bereiche in HTML definieren können Einbinden einer CSS Datei für Design. Verständnis der Trennung von Content (Inhalt, Text, Fotos) und Design (Farbgestaltung, Hintergrund, Schriftart, Schriftfarbe, ) Das folgende Beispiel zeigt einen einzelnen Container header, in welchem in einem Absatz Text geschrieben steht. HTML Datei (content) Diese Zeile bindet die CSS Datei main.css zur HTML Seite, damit der Content passend dargestellt wird CSS Datei (design) <br> <div id= header > <p> bedeutet einen Zeilenumbruch innerhalb eines Absatzes definiert einen Bereich (Container) mit dem Namen header definiert einen Absatz. Wird mit </p> geschlossen Seite 8 von 13

9 CSS Anweisungen und Erklärungen: Anweisungen in einer CSS Datei werden in geschwungene Klammern geschrieben und mit einem Strichpunkt abgeschlossen. Als Farbcode empfiehlt es sich stets den Hexadezimalcode (6-stellig) zu verwenden. (Bsp: #FF56A7) HTML CSS <div id= header > #header { } so spreche ich nur den Container header an <body> body { } so spreche ich den gesamten Bereich body an <p> p { } so spreche ich alle Absätze an (egal in welchem Bereich) CSS besteht immer aus einer Eigenschaft und dem passenden Wert dazu. Bsp: Die Eigenschaft font-style: kann als Werte bold (fett), normal oder italic (kursiv) annehmen border : 1px solid red; background: #ffccff; color: #00ff00; font-family: Arial; font-size: 20px; font-style: bold; width: 400px; margin-top: 10px; margin-right: 20px; margin-bottom: 30px; margin-left: 40px; margin: 10px 20px 30px 40px; padding-top: 10px; padding-right: 20px; padding-bottom: 30px; padding-left: 40px; padding: 10px 20px 30px 40px; Rahmen 1 PIXEL stark rundherum in Farbe rot Hintergrundfarbe Schriftfarbe Schriftart Schriftgröße Fettschrift Weite Breite Außenabstand oben Außenabstand rechts Außenabstand unten Außenabstand links so kann in einer Zeile der Außenabstand definiert werden. (Reihenfolge: oben rechts unten links) Uhrzeigersinn!!! Innenabstand oben Innenabstand rechts Innenabstand unten Innenabstand links so kann in einer Zeile der Innenabstand definiert werden. (Reihenfolge: oben rechts unten links) Uhrzeigersinn!!! Seite 9 von 13

10 8. Stunde Aufgabe: Seitenstruktur wie folgt erstellen können. Die Schüler sollen ein Verständnis zum Stylings der einzelnen Bereiche entwickeln. header <body> menu content <div id= all > <div id= header > <div id= container > <div id= menu > <div id= content > In diesem Beispiel werden anschließend in nur 3 Containern Texte, bzw. Fotos erscheinen. header fixer Kopfbereich der Webseite menu Menüpunkte - links content eigentlicher Inhalt in Form von Text und Fotos. Auch Tabellen möglich. Auszug der HTML Datei Diese html Struktur entspricht der Umsetzung von oben gezeigter Graphik. Seite 10 von 13

11 CSS Eigenschaften float: left; Jedes Element, das man floatet, wir dadurch automatisch zu einem Block- Element. Das bedeutet, dass man ihm sowohl eine Breite (width) als auch eine Höhe (height) zuweisen kann. Tatsächlich müssen Floats sogar eine zugewiesene Breite haben. left bedeutet, dass das Element (Container) links von dem Element plaziert ist, die es umfließen. Auszug der CSS Datei body Hintergrundfarbe, Schriftfarbe und Schriftart gelten für alle weiteren Container und Klassen sofern nicht anders gestylt. #all Dieser umfassende Container hat eine Weite von 1000px. Die Außenabstände (oben, rechts, unten, links) sind wie folgt definiert #header Mit roter Rahmenfarbe eingefasst. 1000px Breite wird vom Container all weitervererbt #container Außenabstand oben mit 10 PIXEL definiert #menu Dieser Container benötigt ein float: left, damit er sich unmittelbar an den vorhergehenden Container (container) links anreiht. #content Außenabstand links mit 200 PIXEL. Rahmeneinfassung rot. Definierte Hintergrundfarbe HÜ: Programmiere dieses Beispiel nach. Verändere nach deinen Bedürfnissen Rahmenfarben Hintergrundfarben Abstände Seite 11 von 13

12 9. Stunde Aufgabe: Menüstruktur mit <ul> und <li> und <a href > erstellen können. Die Schüler sollen ein Verständnis zum Stylings eines Menüs bekommen. Sie sollen die verschiedenen link Zustände kennenlernen und diese auch stylen können. Das folgende Beispiel zeigt ein Menü in der HTML Datei: Du kannst nun in der CSS Datei folgende Stylings definieren. #menu { border: 1px solid red; background: #1988DC; width: 190px; float: left; } #menu ul { background: #0F04F6; } #menu ul li { background: #9995EB; } #menu ul li a:link, #menu ul li a:active, #menu ul li a:focus, #menu ul li a:visited { background: #D7CCCB; } #menu ul li a:hover { background: #EC7F74; Seite 12 von 13 } Styling des gesamten Menüblocks Roter Rahmen 190 PIXEL breit Farbe: Styling der ul Einfassung aller Menüpunkte Farbe: Styling der li alle Listenpunkte Farbe: Styling der einzelnen Links in den unterschiedlichen LINK Zuständen Farbe der LINKS: Farbe des Mouse Hover Effekts: LINK (mouse hover):

13 10. Stunde Aufgabe: Menüstruktur in der sogenannten Startdatei fertig stellen. Kopfbereich und Menü fertig stylen. Jeder Schüler entwickelt nun seine eigene individuelle Seite auf Basis der vorgegebenen HTML Struktur (siehe Bsp. oben) Kennenlernen weiterer CSS Befehle für Menüstyling: list-style: none; Stylt die Listenpunkte vor den LINKS square = Quadrate, none = keine display: block; Styling direkt am LINK (a) bewirkt, dass sich der LINK über die gesamte Breite ausdehnt. Er wird zu einem BLOCK Element. padding: 0; margin: 0; Im Menü auf der ul angewandt, bedeutet das, dass der Innenabstand zum <div> 0 ist. Im Menü auf der ul angewandt, bedeutet das, dass der Außenabstand zum <div> 0 ist. text-decoration: none; Styling direkt am LINK (a) bewirkt, dass der LINK nicht unterstrichen dargestellt wird. text-decoration: underline; Styling direkt am LINK (a) bewirkt, dass der LINK unterstrichen dargestellt wird. Seite 13 von 13

Aufbau einer HTML Seite:

Aufbau einer HTML Seite: 1 Aufbau einer HTML Seite: Grundstruktur: Head Bereich: "nicht sichtbar" Er enthält grundlegende Informationen wie: Title, Charset, Ansichtsgröße,

Mehr

Seiten gestalten mit CSS. Die wichtigsten HTML-Elemente. ,CSS gestaltet dynamisch die HTML-Elemente (Boxen)

Seiten gestalten mit CSS. Die wichtigsten HTML-Elemente. ,CSS gestaltet dynamisch die HTML-Elemente (Boxen) Wichtige Grundlagen Cascading Style Sheets, gestaltet dynamisch die HTML-Elemente (Boxen),Mit legen Sie Schriften und Farben einheitlich fest,über das Box-Modell layouten Sie die Seite,Navigation und Effekte

Mehr

Format- oder Stilvorlagen

Format- oder Stilvorlagen Vorraussetzung Sie sollten Grundkenntnisse der HTML-Sprache besitzen, um die Ausbildungseinheit Formatvorlagen, auch Stilvorlagen genannt, ohne Probleme verstehen zu können. Ist dies nicht der Fall, empfehlen

Mehr

jetzt lerne ich Webseiten programmieren und gestalten Einfache Beispiele mit HTML, CSS, Javascript, ASP und PHP

jetzt lerne ich Webseiten programmieren und gestalten Einfache Beispiele mit HTML, CSS, Javascript, ASP und PHP jetzt lerne ich Webseiten programmieren und gestalten Einfache Beispiele mit HTML, CSS, Javascript, ASP und PHP CHRISTIAN WENZ TOBIAS HAUSER KAPITEL 3 CSS anwenden jetzt lerne ich Style-Sheets sind heute

Mehr

IT- und Medientechnik

IT- und Medientechnik IT- und Medientechnik Vorlesung 4: 2.11.2015 Wintersemester 2015/2016 h_da, Lehrbeauftragter Teil 1: IT- und Medientechnik Themenübersicht der Vorlesung Hard- und Software Hardware: CPU, Speicher, Bus,

Mehr

Vorlesungsinhalte. Internet und Webseiten-Gestaltung. Ausblick. Entwicklungsschritte

Vorlesungsinhalte. Internet und Webseiten-Gestaltung. Ausblick. Entwicklungsschritte Vorlesungsinhalte Internet und Webseiten-Gestaltung Wirtschaftsinformatik 3 Vorlesung 2005-05-13 Dipl.-Inf. (FH) T. Mättig Stylesheets (CSS) Das CSS Box-Modell Fotos, Bilder, Grafiken Tabellen 2005-05-13

Mehr

Die Programmiersprache des Webs. HTML HyperText Markup Language Hypertext - Auszeichnungssprache

Die Programmiersprache des Webs. HTML HyperText Markup Language Hypertext - Auszeichnungssprache Was ist HTML? Die Programmiersprache des Webs HTML HyperText Markup Language Hypertext - Auszeichnungssprache Dateiname Man muss Groß/Kleinschreibung beachten Leerzeichen ist nicht erlaubt Umlaute wie

Mehr

Digitale Medien. Übung

Digitale Medien. Übung Digitale Medien Übung HTML Heute Hyper Text Markup Language Beschreibungssprache von WWW-Seiten: Enthält die Struktur eines Dokuments und teilweise die Darstellung. ich bin eine Überschrift

Mehr

Selektoren in CSS. HTML/CSS 21. November 2013 E1. 1. Beispiel: Kinder und Enkel

Selektoren in CSS. HTML/CSS 21. November 2013 E1. 1. Beispiel: Kinder und Enkel Selektoren in CSS 1. Beispiel: Kinder und Enkel universal Selektor body { font family: sans serif; color : #666; div { border:

Mehr

Die wichtigsten HyperTextMarkupLanguage tags 1(6)

Die wichtigsten HyperTextMarkupLanguage tags 1(6) Die wichtigsten HyperTextMarkupLanguage tags 1(6) HTML ist entgegen vielen Gerüchten keine Programmiersprache, sondern lediglich ein Hilfsmittel um Text und Bild zu formatieren, welche in einem Browser

Mehr

Aufbau eines Klassen-Selektors: selektor.klasse { css-eigenschaft1:wert1; css-eigenschaft2:wert2;...}

Aufbau eines Klassen-Selektors: selektor.klasse { css-eigenschaft1:wert1; css-eigenschaft2:wert2;...} Cascading StyleSheets (CSS) Allgemein CSS (aufeinander aufbauende Stilvorlagen) wurden 1996 vom W3C standardisiert. dienen der Ergänzung strukturierter Dokumente wie HTML oder XML. Ermöglichen die Trennung

Mehr

Aufgabenbereich 3: Layoutgestaltung mit CSS

Aufgabenbereich 3: Layoutgestaltung mit CSS Aufgabenbereich 3: Layoutgestaltung mit CSS Wichtige Begriffe und Zusammenhänge: Website: Gesamtheit eines Internet-Auftrittes (alle Webseiten, die dazu gehören) Webseite: Eine einzelne Seite, ein HTML-Dokument

Mehr

EasyWeb CSS Editor. EasyWeb CSS Editor IACBOX.COM. Version Deutsch

EasyWeb CSS Editor. EasyWeb CSS Editor IACBOX.COM. Version Deutsch EasyWeb CSS Editor Version 2.0.1 Deutsch 19.05.2014 In diesem HOWTO wird beschrieben wie Sie mit Hilfe des EasyWeb CSS Editor die Kunden-Anmeldeseite der IAC-BOX bearbeiten. EasyWeb CSS Editor TITEL Inhaltsverzeichnis

Mehr

Einführungskurs HTML-CSS mit Buch

Einführungskurs HTML-CSS mit Buch Einführungskurs HTML-CSS mit Buch Von Stand: 01.11.2013 Arbeitsblätter Blatt1: Grundlegendes, Software einrichten Blatt2: Link-Arten Blatt3: Wichtige HTML-Elemente Blatt4: Einführung CSS Blatt5: Wichtige

Mehr

Erstellen von Web-Seiten

Erstellen von Web-Seiten Erstellen von Web-Seiten Grundlagen html: Zum Erstellen von html-seiten benötigen wir nur einen Text-Editor. Der Inhalt von HTML-Dateien steht in HTML-Elementen. HTML-Elemente werden durch so genannte

Mehr

Seitengestaltung mit HTML und CSS. Stefan Rothe, Thomas Jampen

Seitengestaltung mit HTML und CSS. Stefan Rothe, Thomas Jampen Seitengestaltung mit HTML und CSS Stefan Rothe, Thomas Jampen 2013 09 12 Rechtliche Hinweise Dieses Werk von Stefan Rothe steht unter einer Attribution-NonCommercial-ShareAlike 3.0 License. Zudem verzichtet

Mehr

WEBSITE ERSTELLEN mit DREAMWEAVER MX

WEBSITE ERSTELLEN mit DREAMWEAVER MX WEBSITE ERSTELLEN mit DREAMWEAVER MX Inhalt: WEBSITE ERSTELLEN mit DREAMWEAVER MX... 1 Neue Site anlegen... 2 Neue HTML-Seite erstellen... 2 Seiteneigenschaften... 2 Webseite speichern... 2 CSS (Cascading

Mehr

Übung zur Vorlesung Digitale Medien. Doris Hausen Ludwig-Maximilians-Universität München Wintersemester 2011/2012

Übung zur Vorlesung Digitale Medien. Doris Hausen Ludwig-Maximilians-Universität München Wintersemester 2011/2012 Übung zur Vorlesung Digitale Medien Doris Hausen Ludwig-Maximilians-Universität München Wintersemester 2011/2012 1 Pfadangaben (1) Pfadangaben sind relevant für Bilder, Verweise, Medienobjekte per URL:

Mehr

Meine erste Homepage - Beispiele

Meine erste Homepage - Beispiele Meine erste - Beispiele 1. Beispiel meine Willkommen auf meiner Befehle nicht über Hier ist ein Senior, der noch fit für's Internet ist. Probieren wir

Mehr

Crashkurs Webseitenerstellung mit HTML

Crashkurs Webseitenerstellung mit HTML Ziel Crashkurs Webseitenerstellung mit HTML Das Ziel dieser Einführung in die Webseitenerstellung ist das Kennenlernen der Seitenbeschreibungssprache HTML und die Nutzung für einfach strukturierte Seiten,

Mehr

CSS-Tutorial. Grundlegende CSS-Kenntnisse

CSS-Tutorial. Grundlegende CSS-Kenntnisse 2008 CSS-Tutorial Grundlegende CSS-Kenntnisse Dieses Tutorial gibt Ihnen verschiedene CSS-Kenntnisse mit an die Hand, damit Sie Ihre Webseite ansprechend gestalten können. Webmasterparadies.de Vertraulich

Mehr

Erstellung von dynamischen Webseiten mit Cascading StyleSheets

Erstellung von dynamischen Webseiten mit Cascading StyleSheets Planerische Informationssysteme Erstellung von dynamischen Webseiten mit Cascading StyleSheets Rolf Sonderegger FS 2014 Erstellung von Webseiten mit Cascading Style Sheets Institut für Raum- und Landschaftsentwicklung

Mehr

INDEXHIBIT 1. Voraussetzung: Serverunterstützung: Linux/Apache server* PHP4+ MySQL 3.23+

INDEXHIBIT 1. Voraussetzung: Serverunterstützung: Linux/Apache server* PHP4+ MySQL 3.23+ INDEXHIBIT 1 Download: www.bgames.ch/hibit.zip Voraussetzung: Serverunterstützung: Linux/Apache server* PHP4+ MySQL 3.23+ Datenbank einrichten: Anleitung zum einrichten einer Datenbank sollten sich auf

Mehr

Angewandte Informatik

Angewandte Informatik Angewandte Informatik Teil 9.1 Web Seiten V1.3 12.03.2011 1 von 37 Inhaltsverzeichnis 3... Welche Browser werden verwendet? 4... Mit welchen Browser surft die Welt? 5... Wie kommt der Browser zur Seite?

Mehr

D a s B e g l e i t s c r i p t z u m

D a s B e g l e i t s c r i p t z u m H T M L f ü r A n f ä n g e r D a s B e g l e i t s c r i p t z u m K u r s Von Konrad Weidmann Im Wintersemester 2005/2006 Inhaltsverzeichnis 0. Einführung...3 1. Bedeutung...3 2. Benutzung...4 a) des

Mehr

Cascading Stylesheets (CSS)

Cascading Stylesheets (CSS) Cascading Stylesheets (CSS) Cascading Stylesheets trennen Webdesign vom eigentlichen Inhalt. Die Vererbung, sprich Kaskadierung, von festgelegten Stilen wird allerdings erst bei fortgeschrittenen Programmierkenntnissen

Mehr

CAS WEBDESIGN UND WEBPUBLISHING KURS 1 / TAG 2: GRUNDLAGEN DER WEBENTWICKLUNG

CAS WEBDESIGN UND WEBPUBLISHING KURS 1 / TAG 2: GRUNDLAGEN DER WEBENTWICKLUNG CAS WEBDESIGN UND WEBPUBLISHING KURS 1 / TAG 2: GRUNDLAGEN DER WEBENTWICKLUNG Von Markus Stauffiger / 4eyes GmbH STRUKTUR UND ZIELE DES HEUTIGEN TAGES Repetition CSS Grundlagen CSS Eigenschaften Wie komme

Mehr

CSS Cascading Style Sheets

CSS Cascading Style Sheets XML light CSS Cascading Style Sheets Jörn Clausen joern@techfak.uni-bielefeld.de Übersicht Wieso Cascading Style Sheets? HTML und CSS XML und CSS Ausblick XML light CSS Cascading Style Sheets 2/24 Probleme,

Mehr

Die eigene Website. Zusatzkapitel CSS mobile Geräte & Ausdruck

Die eigene Website. Zusatzkapitel CSS mobile Geräte & Ausdruck Die eigene Website Zusatzkapitel CSS mobile Geräte & Ausdruck Im Folgenden finden Sie einige Zusatztipps zu Kapitel 6 des Buchs Die eigene Website. Mehr Infos zum Buch auf der Website zum Buch. CSS für

Mehr

Web-Publishing mit HTML

Web-Publishing mit HTML Web-Publishing mit HTML Das HTML-Dokument: Jedes HTML 4-Dokument beginnt mit der Deklaration , um diese Version von anderen Versionen zu unterscheiden.

Mehr

Webdesign-Multimedia HTML und CSS

Webdesign-Multimedia HTML und CSS Webdesign-Multimedia HTML und CSS Thomas Mohr HTML Definition ˆ HTML (Hypertext Markup Language) ist eine textbasierte Auszeichnungssprache (engl. markup language) zur Strukturierung digitaler Dokumente

Mehr

Publizieren im Internet

Publizieren im Internet Publizieren im Internet Eine eigene Homepage erstellen Teil 2 Margarita Esponda esponda@inf.fu-berlin.de Ein Bild als Hintergrund Webseite mit einen Bild als Hintergrund

Mehr

Schiller-Gymnasium Hof 20.12.2004

Schiller-Gymnasium Hof 20.12.2004 Erstellen eines HTML-Dokumentes Zum Erstellen einer Homepage benötigen wir lediglich einen Editor. Zum Ansehen der fertigen Site benötigen wir wir natürlich auch einen Browser, z.b. Firefox oder Netscape

Mehr

Internetseiten selbst erstellt

Internetseiten selbst erstellt Internetseiten selbst erstellt Vorüberlegungen: Übersichtsplan aller geplanten Seiten zeichnen und bereits logische Dateinamen überlegen. Inhalt der Seite Willkommen/Was gibt es zu sehen und was will ich

Mehr

Cascading Style Sheets

Cascading Style Sheets CSS Cascading Style Sheets von Carsten Euwens CSS Vortragsgliederung Grundlagen Bedeutung Wie binde ich CSS überhaupt ein Wie weise ich Styles den einzelnen Elementen zu Was kann man damit machen Text

Mehr

Grundaufbau eines HTML5-Dokumentes (Grautöne visualisieren die Zwiebelstruktur des Dokumentes) <!doctype html> <html lang="de"> <head>

Grundaufbau eines HTML5-Dokumentes (Grautöne visualisieren die Zwiebelstruktur des Dokumentes) <!doctype html> <html lang=de> <head> Grundaufbau eines HTML5-Dokumentes (Grautöne visualisieren die Zwiebelstruktur des Dokumentes) name Ihres HTML-Dokumentes

Mehr

Kapitel 8 HTML. Copyright by Worldsoft AG, 2014, Pfäffikon SZ, Switzerland. Version: 02.10.2014 Seite 1

Kapitel 8 HTML. Copyright by Worldsoft AG, 2014, Pfäffikon SZ, Switzerland. Version: 02.10.2014 Seite 1 Kapitel 8 Notwendige Voraussetzungen für diese Schulung: Internetfähiger Computer mit aktuellem Browser (z.b. Firefox, Internet Explorer) Bild- und Textvorlagen: Diese Vorlagen finden Sie auf der CC-Website

Mehr

Über den Link Inhalte bearbeiten in der Navigation erreichen Sie den Online Editor.

Über den Link Inhalte bearbeiten in der Navigation erreichen Sie den Online Editor. Homepage bearbeiten mit dem ezillo.com Online Editor Bei ezillo.com können Sie für Ihre kostenlose Erotik Homepage eigene Unterseiten erstellen und bearbeiten. Dazu steht Ihnen mit dem Online Editor ein

Mehr

Einführungskurs HTML-CSS ohne Buch Von Norbert Willimsky Stand: 01.11.2015

Einführungskurs HTML-CSS ohne Buch Von Norbert Willimsky Stand: 01.11.2015 Einführungskurs HTML-CSS ohne Buch Von Stand: 01.11.2015 Inhalt Grundlegendes... 2 Einführung in HTML... 4 Übung1: HTML und einfaches CSS anwenden... 5 Einführung in CSS... 6 Übung2: CSS anwenden... 8

Mehr

Textverarbeitung 1. 1. Textentwurf 2. Texterfassung 3. Textumformung 4. Textgestaltung 5. Textverwendung

Textverarbeitung 1. 1. Textentwurf 2. Texterfassung 3. Textumformung 4. Textgestaltung 5. Textverwendung Informatik - Text / HTML 1 Textverarbeitung 1 1. Textentwurf 2. Texterfassung 3. Textumformung 4. Textgestaltung 5. Textverwendung Leistungsmerkmale Textverarbeitung ist Standardsoftware - nutzerorientiert,

Mehr

CSS. Cascading Stylesheets

CSS. Cascading Stylesheets CSS Cascading Stylesheets Themen Was sind Cascading Stylesheets? Vorteile von CSS Nachteile von CSS CSS: Versionen Regelsyntax für Stylesheets Einem HTML-Dokument Styles hinzufügen und Numerische

Mehr

Eine wirklich große Hilfe war die Typo3-Dokumentation der Firma Mittwald: https://www.mittwald.de/fileadmin/pdf/dokus/typo3-dokumentation.

Eine wirklich große Hilfe war die Typo3-Dokumentation der Firma Mittwald: https://www.mittwald.de/fileadmin/pdf/dokus/typo3-dokumentation. Die neue Internetseite mit Typo3 (Stand vom 25.12.2015) Ein Anfang Also, ich habe längst nicht alles verstanden, einige Befehlsketten einfach rein kopiert und deshalb sicher auch sinnlose Programmteile

Mehr

Hermann von Helmholtz-Zentrum für Kulturtechnik Übung: Multimedia-Anwendungen in den Wissenschaften. Tutorium. Mozilla Composer. Ein kurzer Überblick

Hermann von Helmholtz-Zentrum für Kulturtechnik Übung: Multimedia-Anwendungen in den Wissenschaften. Tutorium. Mozilla Composer. Ein kurzer Überblick Tutorium Mozilla Composer Ein kurzer Überblick Vorbereitung: Projektordner erstellen Für jede projektierte Website wird zuerst ein eigener Projektordner erstellt, der alle zu publizierenden Dateien aufnimmt.

Mehr

Seminar DWMX 2004. DW Session 004

Seminar DWMX 2004. DW Session 004 Seminar DWMX 2004 DW Session 004 Eigene Site aufbauen Aufbau einer persönlichen Site: Auswahl einer bestimmten Dateiorganisation Statische HTML Site Vorlagenbasierte Site Framebasierte Site Erstellen der

Mehr

HTML Programmierung. Aufgaben

HTML Programmierung. Aufgaben HTML Programmierung Dr. Leander Brandl BRG Keplerstraße - A-8020 Graz Universität Graz - Institut für Experimentalphysik Fachdidaktik der Physik http://w4.brgkepler.asn-graz.ac.at 1. Die erste Web-Seite

Mehr

Einführung in die Webentwicklung

Einführung in die Webentwicklung Einführung in die Webentwicklung Mit HTML5 und CSS3 auf dem Weg zur eigenen Website Kerstin Blumenstein EXPOSEE Dieses Script beinhaltet alle in dem Kurs durchgenommenen - Teile mit Erklärungen von Tag

Mehr

http://www.therealgang.de/

http://www.therealgang.de/ http://www.therealgang.de/ Titel : Author : Kategorie : Vorlesung HTML und XML (Einführung) Dr. Pascal Rheinert Sonstige-Programmierung Vorlesung HTML / XML: Grundlegende Informationen zu HTML a.) Allgemeines:

Mehr

CSS-Boxen. Hans Gell Schulungen & Dienstleistungen Übersicht der Schulungsinhalte

CSS-Boxen. Hans Gell Schulungen & Dienstleistungen  Übersicht der Schulungsinhalte CSS-Boxen Übersicht der Schulungsinhalte Das Web ist nicht aus Papier enttäuschte Erwartungen Autor hat keine Kontrolle Webseiten sehen immer anders aus Webseiten sind flexibel - Papierseiten sind starr

Mehr

Inhalte mit DNN Modul HTML bearbeiten

Inhalte mit DNN Modul HTML bearbeiten Einführung Redaktoren Content Management System DotNetNuke Inhalte mit DNN Modul HTML bearbeiten DotNetNuke Version 6+ w3studio GmbH info@w3studio.ch www.w3studio.ch T 056 288 06 29 Letzter Ausdruck: 14.09.2012

Mehr

CSS Cascading Stylesheets

CSS Cascading Stylesheets CSS Cascading Stylesheets 1. Einführung Warum denn CSS= Cascading Style Sheets? CSS ist eine Spache, bestimmt für die Formatierung von HTML-Seiten. Sie greift auf die Sprachelemente von HTML zu und verleiht

Mehr

Yootheme Master2 - ein flexibles Template für Joomla!

Yootheme Master2 - ein flexibles Template für Joomla! Yootheme Master2 - ein flexibles Template für Joomla! Yootheme ist ein kostenloses Template für Joomla, das sowohl Anfängern als auch Fortgeschrittenen mit CSS Kenntnissen weitreichende Einstellungsmöglichkeiten

Mehr

Projektarbeit Multimedia-Technologien Erstellung eines E-Learnings zum Online-Tool WireWax

Projektarbeit Multimedia-Technologien Erstellung eines E-Learnings zum Online-Tool WireWax Projektarbeit Multimedia-Technologien Erstellung eines E-Learnings zum Online-Tool WireWax 5.11.2015 bis 21.01.2016 Carolin Schneider (Matrikelnummer: 40127) Inhaltsverzeichnis Ziel des Projekts... 3 Projektverlauf...

Mehr

Falls Sie den Hintergrund der Website schon kennen, wählen Sie am einfachsten die gleiche Farbe in Photoshop für die Schaltfläche.

Falls Sie den Hintergrund der Website schon kennen, wählen Sie am einfachsten die gleiche Farbe in Photoshop für die Schaltfläche. 1. Schritt Schaltfläche vorbereiten In Photoshop eine neue Datei in Größe der Schaltfläche erstellen. Hier: Breite: 100 Pixel Höhe: 50 Pixel Auflösung 72 dpi Hintergrund: Weiß* Der weiße Hintergrund ist

Mehr

Inhalte mit DNN Modul HTML bearbeiten

Inhalte mit DNN Modul HTML bearbeiten Einführung Redaktoren Content Management System DotNetNuke Inhalte mit DNN Modul HTML bearbeiten DotNetNuke Version 7+ w3studio GmbH info@w3studio.ch www.w3studio.ch T 056 288 06 29 Letzter Ausdruck: 15.08.2013

Mehr

11 Publizieren im Web

11 Publizieren im Web 11 Publizieren im Web Für ein modernes Unternehmen ist es heute kaum vorstellbar, nicht im Internet vertreten zu sein. Laut Statistik Austria 7 haben 97 % aller österreichischen Unternehmen ab 10 Beschäftigten

Mehr

GRUNDLAGEN HTML + CSS

GRUNDLAGEN HTML + CSS GRUNDLAGEN HTML + CSS Bitte beachten Sie mein Urheberrecht. Keine Veröffentlichung auch nicht in Auszügen - oder Weitergabe an Dritte ohne mein Einverständnis. alle Rechte vorbehalten: BüroSmart, Michaela

Mehr

Online-Publishing mit HTML und CSS für Einsteigerinnen

Online-Publishing mit HTML und CSS für Einsteigerinnen Online-Publishing mit HTML und CSS für Einsteigerinnen Dipl. Math. Eva Dyllong, Universität Duisburg Dipl. Math. Maria Oelinger, spirito GmbH IF MYT 07 2002 CSS-Einführung Vorschau CSS Was ist das? Einbinden

Mehr

HTML und CSS. Eine kurze Einführung

HTML und CSS. Eine kurze Einführung HTML und CSS Eine kurze Einführung Begriff Markup Begriff aus Druckindustrie: Layouter fügt Anmerkungen/Markierungen (Tags) hinzu Markup-Languge (ML) = Auszeichnungssprache Beispiele a) das Wort wird fett

Mehr

Vorbereitung Termin 4

Vorbereitung Termin 4 Vorbereitung Termin 4 Spezielle Links & Linkattribute 2 Ein Bild verlinken Das Ankerelement wird erst durch das Attribut href zum funktionierenden

Mehr

Navigation für Internetpräsenzen

Navigation für Internetpräsenzen Navigation für Internetpräsenzen Gestern und heute 2016 Navigieren in Internetseiten Das Wort Navigation wird den meisten bekannt sein und fast jeder kann eine Verknüpfung aus seinem alltäglichen Leben

Mehr

3 WEBSEITEN GESTALTEN

3 WEBSEITEN GESTALTEN Webseiten gestalten FrontPage effektiv 3 WEBSEITEN GESTALTEN 3.1 Textformatierung Um einen Text formatieren zu können, müssen Sie ihn zuvor markieren. Anschließend hilft Ihnen die Format-Symbolleiste dabei,

Mehr

Frames oder Rahmen im Browserfenster

Frames oder Rahmen im Browserfenster In dieser Ausbildungseinheit zeigen wir Ihnen, wie Frames oder auch Rahmen im Browserfenster erstellt werden. Dabei möchten wir anmerken, dass zu Frames bereits sehr viel Gegensätzliches geschrieben wurde.

Mehr

Veranstaltung Systementwicklung. HTML und CSS. Uwe H. Suhl und Chris Bizer SS 2008

Veranstaltung Systementwicklung. HTML und CSS. Uwe H. Suhl und Chris Bizer SS 2008 Veranstaltung 10033013 Systementwicklung HTML und CSS Uwe H. Suhl und Chris Bizer SS 2008 HTML - Hypertext Markup Language HTML ist eine Auszeichnungssprache für Web-Dokumente Auszeichnungssprachen Auszeichnen

Mehr

Einführung in HTML. Tutorium. Präsentation der Sitzung vom 2./9. Juni 2004 Martin Stricker

Einführung in HTML. Tutorium. Präsentation der Sitzung vom 2./9. Juni 2004 Martin Stricker Tutorium Einführung in HTML Präsentation der Sitzung vom 2./9. Juni 2004 Martin Stricker martin.stricker@rz.hu-berlin.de Programm Grundlagen von HTML Objekte, Elemente, Tags Grundaufbau eines HTML-Dokuments

Mehr

Der Editor - Einfügen von Links und Medien

Der Editor - Einfügen von Links und Medien Link einfügen Der Editor - Einfügen von Links und Medien Link einfügen Soll durch einen Klick auf einen Text eine Webseite oder ein Dokument geöffnet werden, dann gestalten Sie den Text als Link. Schreiben

Mehr

Praktikum 8: CSS-Layout

Praktikum 8: CSS-Layout WEB1 Web-Technologien 1 Praktikum 8: CSS-Layout Gerrit Burkert, 01.11.2014 Ziele In einem früheren Praktikum haben Sie den HTML-Code für eine Reisebüroseite gemacht. Ziel dieses Praktikums ist es, die

Mehr

Cascading Style Sheets II (CSS)

Cascading Style Sheets II (CSS) Cascading Style Sheets II (CSS) CSS ist ein Befehlssystem, das die Erscheinungsform von HTML-Elementen regelt. Bei modernen Websites ist der Inhalt der Site unabhängig vom Layout. HTML übernimmt den Inhalt,

Mehr

Farb-, Text- und Schriftgestaltung mit CSS3

Farb-, Text- und Schriftgestaltung mit CSS3 CT» LPE 05» 03 Textgestaltung» Hintergrundgestaltung Farb-, Text- und Schriftgestaltung mit CSS3 Eine HTML5-Datei ist reine Textdatei. In dieser Datei wird lediglich der Inhalt und die Stuktur einer Webseite

Mehr

Cascading Style Sheets (CSS)

Cascading Style Sheets (CSS) Cascading Style Sheets (CSS) CSS sind eine unmittelbare Ergänzung zu HTML. Es handelt sich um einen firmenunabhängigen, offen dokumentierten und frei verwendbaren Standard. Es ist eine Sprache zur Formatierung

Mehr

HTML-Grundlagen (X)HTML:

HTML-Grundlagen (X)HTML: HTML-Grundlagen (X)HTML: < > beginnender HTML Tag schließender HTML Tag < /> leere HTML Elemente Attribute und Werte &.; Sonderzeichen, HTML Entities Aufbau einer Datei Ein

Mehr

Hypertext Markup Language HTML. Stefan Szalowski Internet-Technologien HTML

Hypertext Markup Language HTML. Stefan Szalowski Internet-Technologien HTML Hypertext Markup Language HTML Hypertext Markup Language HTML Cascading Style Sheets CSS Zwei Sprachen, mit denen Webseiten erstellt werden HTML: Strukturieren von Inhalten durch Elemente Überschriften,

Mehr

Responsive Webdesign. IHK-Arbeitskreis Software. Prof. Dr. Manfred Wojciechowski 18.02.2014

Responsive Webdesign. IHK-Arbeitskreis Software. Prof. Dr. Manfred Wojciechowski 18.02.2014 IHK-Arbeitskreis Software Prof. Dr. Manfred Wojciechowski 18.02.2014 Aufbau Vorstellung Responsive Webdesign Motivation Technologien Frameworks 2 Vorstellung Zur Person 1991 1996: Studium Informatik an

Mehr

CAS Webdesign und Webpublishing

CAS Webdesign und Webpublishing CAS Webdesign und Webpublishing Kurs 2: Fortgeschrittenes CSS Ausgabe 2014 Dozent Andi Keller andi@4eyes.ch 4eyes GmbH Falknerstrasse 52 4001 Basel +41 61 261 43 48 info@4eyes.ch CHE-112.759.842 MWST Seite

Mehr

Zeile 3-7: Der Kopf der HTML-Datei. Hier werden unsichtbare Einstellungen für das ganze Dokument vorgenommen.

Zeile 3-7: Der Kopf der HTML-Datei. Hier werden unsichtbare Einstellungen für das ganze Dokument vorgenommen. Inhalt: Grundgerüst, Tags, Zeichensatz, Meta-Tags, Farben 1 2 3 4 titel der Datei 5 6

Mehr

HTML. Hypertext Markup Language

HTML. Hypertext Markup Language HTML Hypertext Markup Language Begriff Markup Begriff aus Druckindustrie: Layouter fügt Anmerkungen/Markierungen (Tags) hinzu Markup-Languge (ML) = Auszeichnungssprache Beispiele a) das Wort wird fett

Mehr

Informatik und Programmiersprachen

Informatik und Programmiersprachen Informatik und Programmiersprachen Einschub: HTML Wintersemester 2004/2005 Prof. Dr. Thomas Wieland HTML HTML = Hypertext Markup Language HTML beschreibt Inhalt, Struktur und Darstellung eines Dokumentes.

Mehr

Stichpunkte zum Aufbau einer HTML-Website

Stichpunkte zum Aufbau einer HTML-Website Stichpunkte zum Aufbau einer HTML-Website Aufbau eines HTML-Dokumentes: HTML = Hyper Text Markup Language Texteditor zur Befehlseingabe oder im Browser (MIE) Ansicht Quellcode Tags = HTML-Befehle - immer

Mehr

Inhalt. Hintergrund HTML CSS. JavaScript und das Document Object Model

Inhalt. Hintergrund HTML CSS. JavaScript und das Document Object Model Andreas Heß Inhalt Hintergrund HTML CSS JavaScript und das Document Object Model Netz-Protokolle Schichtenmodell OSI DoD Beispiele 7 Anwendung 6 Darstellung 5 Sitzung Anwendungen HTTP, HTTPS, SMTP,

Mehr

TYPOlight-Usertreffen 2009. Barrierefreiheit?

TYPOlight-Usertreffen 2009. Barrierefreiheit? Barrierefreiheit? Das ist doch nur für Blinde! Zu kompliziert. Zu teuer. Unsere Kunden sind nicht behindert. Müssen wir machen *seufz* sind verpflichtet Wir haben schon eine NurText-Version. Barrierefreiheit!

Mehr

Erzherzog Johann Jahr 2009

Erzherzog Johann Jahr 2009 Erzherzog Johann Jahr 2009 Der Erzherzog Johann Tag an der FH JOANNEUM in Kapfenberg Was wird zur Erstellung einer Webseite benötigt? Um eine Webseite zu erstellen, sind die folgenden Dinge nötig: 1. Ein

Mehr

Kurze Bedienungsanleitung für den Kompozer

Kurze Bedienungsanleitung für den Kompozer Kurze Bedienungsanleitung für den Kompozer Dateioperationen Datei öffnen Datei > Öffnen oder S + o Datei speichern Datei > Speichern oder S + s Datei unter einem neuen Namen oder an einem anderen Ort speichern

Mehr

Grundlagen zu HTML. Vortrag im Rahmen der BTK-Vorlesung von Herrn Professor Kärger

Grundlagen zu HTML. Vortrag im Rahmen der BTK-Vorlesung von Herrn Professor Kärger Grundlagen zu HTML Vortrag im Rahmen der BTK-Vorlesung von Herrn Professor Kärger Folie: 1 Gliederung Folie: 2 Was ist HTML Die Sprache HTML Aufbau von HTML-Tags Das HTML-Grundgerüst Hintergrundformatierungen

Mehr

Kapitel 17: CSS. Inhalt. Was kann CSS? (1) Was kann CSS? (2) 1. Einführung CSS. 2. Farben, Hintergründe, Zeichensätze. 3. Gruppierungen. 4.

Kapitel 17: CSS. Inhalt. Was kann CSS? (1) Was kann CSS? (2) 1. Einführung CSS. 2. Farben, Hintergründe, Zeichensätze. 3. Gruppierungen. 4. 17. CSS - Cascading Style Sheets 17-1 17. CSS - Cascading Style Sheets 17-2 Inhalt 1. Einführung CSS 2. Farben, Hintergründe, Zeichensätze Kapitel 17: CSS 3. Gruppierungen 4. Box-Modell 5. Validierung

Mehr

RÖK Typo3 Dokumentation

RÖK Typo3 Dokumentation 2016 RÖK Typo3 Dokumentation Redakteur Sparten Eine Hilfe für den Einstieg in Typo3. Innpuls Werbeagentur GmbH 01.01.2016 2 RÖK Typo3 Dokumentation 1) Was ist Typo3?... 3 2) Typo3 aufrufen und Anmelden...

Mehr

Inhalte mit DNN Modul HTML bearbeiten

Inhalte mit DNN Modul HTML bearbeiten Einführung Redaktoren Content Management System DotNetNuke Inhalte mit DNN Modul HTML bearbeiten DNN Version ab 5.0 w3studio GmbH info@w3studio.ch www.w3studio.ch T 056 288 06 29 Letzter Ausdruck: 22.08.2011

Mehr

HTML- Editor Phase5. Dieser Einstieg ist für absolute HTML-Neulinge gedacht, die weder den Editor Phase5 selbst, noch HTML kennen.

HTML- Editor Phase5. Dieser Einstieg ist für absolute HTML-Neulinge gedacht, die weder den Editor Phase5 selbst, noch HTML kennen. Quelle: http://www.clairette.de/tutorial/index.html http://www.meybohm.de Phase5 Editor Der Einstieg Dieser Einstieg ist für absolute HTML-Neulinge gedacht, die weder den Editor Phase5 selbst, noch HTML

Mehr

Internet und Webseiten-Gestaltung

Internet und Webseiten-Gestaltung Internet und Webseiten-Gestaltung Wirtschaftsinformatik 3 Vorlesung 5. Mai 2004 Dipl.-Inf. T. Mättig 2004-04-28 Internet und Webseiten-Gestaltung - T. Mättig 1 Vorbemerkungen Dipl.-Inf. T. Mättig E-Mail:

Mehr

Anleitung zur Pflege der Homepage über den Raiffeisen-Homepage-Manager

Anleitung zur Pflege der Homepage über den Raiffeisen-Homepage-Manager Anleitung zur Pflege der Homepage über den Raiffeisen-Homepage-Manager Homepage-Manager Navigation Home Der Homepage-Manager bietet die Möglichkeit im Startmenü unter dem Punkt Home einfach und schnell

Mehr

HTML-Kurzübersicht 1. Die wichtigsten Elemente. HTML-Kurz-Übersicht

HTML-Kurzübersicht 1. Die wichtigsten Elemente. HTML-Kurz-Übersicht HTML-Kurzübersicht 1 Alle HTML-Elemente können wie Kästen (little boxes) gedacht werden. Sie werden mit einem Etikett (tag) aufgemacht und mit einem Etikett desselben Namens geschlossen. Der

Mehr

Diese Seite kann auch als pdf-file heruntergeladen werden.

Diese Seite kann auch als pdf-file heruntergeladen werden. Kleines Vademecum für cms 3.0 (artmedic) Trifles-Kleinigkeiten Diese Seite kann auch als pdf-file heruntergeladen werden. Bearbeitungsprogramm starten Browser starten In Browserfenster der Website.ch/cms_index.php

Mehr

HTML5. Grundlagen der Erstellung von Webseiten. Linda York, Tina Wegener. 1. Ausgabe, Dezember 2011 HTML5

HTML5. Grundlagen der Erstellung von Webseiten. Linda York, Tina Wegener. 1. Ausgabe, Dezember 2011 HTML5 Linda York, Tina Wegener HTML5 Grundlagen der Erstellung von Webseiten 1. Ausgabe, Dezember 2011 HTML5 2 HTML5 - Grundlagen der Erstellung von Webseiten 2 Die erste Webseite mit HTML erstellen In diesem

Mehr

Slices und Rollover für die Startseite einer Bildergalerie

Slices und Rollover für die Startseite einer Bildergalerie Slices und Rollover für die Startseite einer Bildergalerie Die größte Frage bei einer Webseite ist es, auf ggf. viele Informationen von der relativ kleinen Fläche eines Bildschirmes zu verweisen. Dabei

Mehr

SASS für Einsteiger. WordCamp Köln 2015. 06.06.2015 Bernhard Kau @2ndkauboy kau-boys.de 1

SASS für Einsteiger. WordCamp Köln 2015. 06.06.2015 Bernhard Kau @2ndkauboy kau-boys.de 1 SASS für Einsteiger WordCamp Köln 2015 06.06.2015 Bernhard Kau @2ndkauboy kau-boys.de 1 Wer bin ich? Bernhard Kau Wahlberliner PHP-Entwickler WordPress-Plugin Hobby-Entwickler CSS-Tüftler Organisator der

Mehr

HTML Teil 2. So kann man HTML-Seiten mit <div> und CSS gestalten. So sehen einfache Formulare aus

HTML Teil 2. So kann man HTML-Seiten mit <div> und CSS gestalten. So sehen einfache Formulare aus HTML Teil 2 So kann man HTML-Seiten mit und CSS gestalten So sehen einfache Formulare aus Wie könnte ein komplexer Internetauftritt aussehen? Trennung Inhaltsbereich und Navigationsbereich 2 Beispiel:

Mehr

Seiten und Inhalte verlinken

Seiten und Inhalte verlinken Seiten und Inhalte verlinken 70 Seiten verlinken Erstellen Sie zwei HTML-Seiten und speichern Sie sie unter den Namen seite.html und seite.html. Fügen Sie in seite.html ein -tag ein, um auf Seite zu

Mehr

Es gibt zahlreiche Web-Programmiersprachen: HTML, CSS, JavaScript, PHP, Perl, Python, HTTP, XML und viele weitere.

Es gibt zahlreiche Web-Programmiersprachen: HTML, CSS, JavaScript, PHP, Perl, Python, HTTP, XML und viele weitere. 1.0.0 Allgemeine Informationen Es gibt zahlreiche Web-Programmiersprachen: HTML, CSS, JavaScript, PHP, Perl, Python, HTTP, XML und viele weitere. Wir werden uns hauptsächlich mit HTML beschäftigen, weil

Mehr

Wert. { color: blue; }

Wert. { color: blue; } CSS im Überblick HTML wurde vom W3C entwickelt, um die Inhalte einer Webseite zu gliedern und zu strukturieren. In HTML wird festgelegt, ob ein Textinhalt bspw. dies ist eine Überschrift oder

Mehr

Das Grundgerüst für ein HTML-Dokument sieht so aus:

Das Grundgerüst für ein HTML-Dokument sieht so aus: Schuljahr 2013 2014 Projekt im Mathematisch-Naturwissenschaftlichen Profil Geschichte der Mathematik HTML - Internetpräsentation Klasse 8B M.Reuß Das Grundgerüst für ein HTML-Dokument sieht so aus:

Mehr

Eine Einführung in HTML

Eine Einführung in HTML Eine Einführung in HTML Inhaltsverzeichnis Grundaufbau einer Webseite... 2 Grundlegende Steuerzeichen... 3 Textformatierungen... 4 Überschriften und Listen... 5 Tabellen... 6 Bilder einfügen... 7 Hyperlinks

Mehr

Innovator 11. Design der Dokumentation ändern. Wie Sie die Dokumentation von Innovator Ihrer Corporate Identity anpassen. HowTo. www.mid.

Innovator 11. Design der Dokumentation ändern. Wie Sie die Dokumentation von Innovator Ihrer Corporate Identity anpassen. HowTo. www.mid. Innovator 11 Design der Dokumentation ändern Wie Sie die Dokumentation von Innovator Ihrer Corporate Identity anpassen www.mid.de HowTo Übersicht zum Layout der Dokumentation Das Layout der Innovator-Dokumentationen

Mehr