© Manz Verlag Schulbuch Folie 1/5 Layout mit CSSAngewandte Informatik HMTL und CSS Lerneinheit 2 Grandhotel Die Lobby HTML für Struktur HTML und CSS Einbinden.

Slides:

Advertisements

Ähnliche Präsentationen

Umlaufvermögen und Vorräte

Advertisements

XHTML+CSS C3O 2003.

Praktikumsbericht Olga Syasina Sommersemester 2007 Projektseminar

Internet und Webseiten-Gestaltung

CSS – Cascading Style Sheets

Layout-Modelle für Webseiten und Formulare Ein Überblick über Cascading Stylesheets und JGoodies Stephan Winter, 2004, PG WaviSp, AG-Kastens.

Seite 1Maria, Philipp, Herbert Seite 1 Fitnessplaner Ziele: >Fitnessplaner für Onlinebetrieb >Registrierung >individuelle Trainingsplanerstellung.

Cascading Style Sheets

Cascading Style Sheets

Cascading Style Sheets CSS

Medien- Technik Millennium Edition 1 Minimales HTML-Dokument Datei: NeueSeite.htm Wie man einen Seitentitel einfügt Seitentitel.

Teil 4 Formatierung mit CSS.

HTML wird nicht programmiert, sondern einfach geschrieben!

Informatik Anwendungen I

HTML (I) am Cern in Genf von Sir Tim Berners-Lee entwickelt

Abiturprüfung Informatik

Metro-Style Apps mit Expression Blend 5 für HTML designen Christian Moser User Experience Designer Zühlke Engineering AG

Layout mit CSS Iftikhar Ahmad Datum: 2.Juni.2005.

Raimond Reichert Einführung in die Verwendung von Processing innerhalb von Eclipse.

Information und ihre Darstellung: XHTML & CSS

Tutorium zur LV Online Research Ein Computerprogramm tut, was Du schreibst, nicht was Du willst.

Daniel Kucher Proseminar XHTML. 1. HTML – Struktur und Versionen 2. Der – Teil 3. Der – Teil 4. Stylesheets (CSS) – Das Rückrat von XHTML.

Aufbau der Stylesheet-Angabe Eigenschaft Eigenschaft das was man formatieren möchte Wert Wert Farbangaben, Einheiten oder Schlüsselworte Deklaration Kombination.

Computertechnik heute

CSS – Cascading Style Sheets

HTML und CSS Erstellung einer APP. HTML: head Sharky.

PHP in HTML Von C. Göpfert.

WAI konforme Seiten mit TYPO3 (Web Accessibility Initative) © Peter Luser 2005.

CSS Stylesheets Projekt Vollpension Romi Klockau

Barrierefreies Webdesign Überarbeitung der Homepage

Hypertext Markup Language

ÜBERSCHRIFTEN <H1> Überschrift 1 </H1>

HTML Grundkurs Patrick Cato.

Wie funktionieren Internetseiten? Html und Co – Teil 2 Heimo Reiter.

Wordpress 4.0 oder: Wie man ein CMS benutzt und administriert.

CSS Cascading Style Sheets

Cascading Style Sheets

Goldpartner: Veranstalter: Der Werkzeugkasten für Entwickler Ein UI-Framework in AngularJS Timo Korinth.

Cascading Stylesheets Staffelbare Formatvorlagen sind eine direkte Erweiterung von HTML und gestatten eine exaktere Gestaltung einer Webseite. Seit 1998.

Formeln | Definierte Namen

Wordpress 4.0 oder: Wie man ein CMS benutzt und administriert.

Mehrfach-informationen Einfachinformationen

Alles was man wissen muss! By Benjamin Zehetner. Der Aufbau Der Standart Aufbau ist: (Hier muss alles drinnen sein) (Hier befinden sich wichtige Informationen.

BRÜCKENSEMESTER Kursthema: Frontend-Entwicklung für Webapplikationen M.Sc. Anna Prenzel, Sebastian Otto.

DREAMWEAVER MODUL DRWMX_0203 WEBDESIGN MODUL DRW_02 h.huetter 1 Dreamweaver MX - Tabellen Teil 3 Den Schriftstil ändern Um die CSS-Formatierungen auch.

Tourismus-Office © Manz Verlag Schulbuch Folie 1/8 Software und Betriebssysteme Dateiarten Dateihandling Papierkorb Suchen Druckeransteuerung Netzwerkdrucker.

Aufbau eines Betriebssystems

Funktionsweise von CMS

Entwicklungsumgebung

Prototyp einer Website

- Warum: Das HTML-Dilemma

© Manz Verlag Schulbuch Angewandte Informatik HLW IV/V Folie 1/5 Planung und Management von Internet-Servern Einrichtung Lerneinheit 1 Einrichtung Konfiguration.

Räumliche Ausdehnung von Netzwerken

Abschlussprojekt.  Wahl eines beliebigen Themas (z.b. Hobby)  eigenständige Ausarbeitung des gewählten Themas in Form einer Website Abschlussprojekt.

Stylesheets: Formatvorlagen in HTML

C OLOR -D EFINITION Maya Kindler 6c. H EXADEZIMAHL SYSTEM man hat 16 Ziffern und bis 0 bis 9 sinds zahlen und ab dann buchstaben (bis 15). die erste Ziffer.

Maya K.. CSS  Greift auf den button zu und macht den Außenabstand auf 15px und den Innenabstand auf 15px.  Die Hintergrund Farbe soll sein: #eeeeee.

VERERBUNG IN CSS DAVID RUŽIĆ 6C. WIE FUNKTIONIERT VERERBEN? Ein Element kann sein Aussehen von einem umgebenden Element erben. Auf diese Weise kann man.

TODO Gruppenarbeit: css3, float, Webseite, Navigationsmenü, overwrite, Bildergallerie Float und Spaltenlayout Aufgaben dazu definieren css3 Chrome: Inspect.

Direkte Abschreibung Buchungssatz: Darstellung:

CSS Float Sommerkurs: Frontend-Entwicklung für Webapplikationen

Phasen der Weberstellung

ü Kapitelübersicht Grundfunktionen Berechnungen Layoutfunktionen

Bildung einer Rückstellung

CSS Layout Sommerkurs: Frontend-Entwicklung für Webapplikationen

1 Seminar: Web-Engineering Cascading Style Sheets Stefan Hoferer Betreuung: Eva Giani.

Ein Winkellayout mit float

XamlCSS  Style XAML With CSS David Rettenbacher 

Präsentation transkript:

© Manz Verlag Schulbuch Folie 1/5 Layout mit CSSAngewandte Informatik HMTL und CSS Lerneinheit 2 Grandhotel Die Lobby HTML für Struktur HTML und CSS Einbinden von CSS Dreamweaver CS3 Das Box-Modell Selektoren h1 { color:#FFFFFF; background-color:#790000; border: 2px solid white; padding: 5px; left:50px; right:50px;} CSS für Design

© Manz Verlag Schulbuch Folie 2/5 Layout mit CSSAngewandte Informatik Einbinden von CSS Lerneinheit 2 HTML und CSS Einbinden von CSS Dreamweaver CS3 Das Box-Modell Selektoren Element-Regel Notierung direkt beim HTML-Tag Regel gilt nur für ein HTML-Element Dokument-Regel Notierung im HEAD-Bereich Regel gilt nur für eine HTML-Seite Externe CSS-Datei Einbindung im HEAD-Bereich Regel gilt für viele Seiten Rote Überschrift h1 {color: red;} </style HTML-Datei: <link rel="stylesheet" type="text/css" href="styles.css"> CSS-Datei: h1 {color: red;}

© Manz Verlag Schulbuch Folie 3/5 Layout mit CSSAngewandte Informatik Dreamweaver CS3 Lerneinheit 2 HTML und CSS Einbindung von CSS Dreamweaver CS3 Das Box-Modell Selektoren

© Manz Verlag Schulbuch Folie 4/5 Layout mit CSSAngewandte Informatik Das Box-Modell Lerneinheit 2 HTML und CSS Einbindung von CSS Dreamweaver CS3 Das Box-Modell Selektoren Jedes HTML-Block-Element erzeugt im Browserfenster einen rechteckigen Bereich: die Box. Für diese können - Breite (width) - Höhe (height) - Innenabstand (padding) - Außenabstand (margin) - Rahmen (border) definiert und formatiert werden. h1 { width: 500px; height: 50px; padding: 5px; margin: 10px; border: 2px solid red;} p { padding-top: 20px; padding-right: 5px; padding-bottom: 10px; padding-left: 15px;} Diese Eigenschaften können getrennt für oben, rechts, unten und links festgelegt werden.

© Manz Verlag Schulbuch Folie 5/5 Layout mit CSSAngewandte Informatik Selektoren Lerneinheit 2 HTML und CSS Einbinden von CSS Dreamweaver CS3 Das Box-Modell Selektoren Universalselektor gilt für alle Elemente Typ-Selektor gilt für einen bestimmten Elementtyp Class-Selektor kann unabhängig von HTML- Elementen definiert werden und ist auf jedes HTML-Element anwendbar; darf beliebig oft verwendet werden, der Name ist frei wählbar * { font-size: 12px; } ID-Selektor Kann unabhängig von HTML- Elementen definiert werden; darf auf einer HTML-Seite nur einmal vorkommen, der Name ist frei wählbar h1 { font-size: 12px; }.klein { font-size: 8px; } oder h1.klein { font-size: 8px; }... #nav { font-size: 8px; }...