Was ist CSS? Info:
|
|
|
- Sebastian Hertz
- vor 6 Jahren
- Abrufe
Transkript
1 Was ist CSS? Info: Eberhart 1.css.einstieg.docx 1
2 CSS: Ist eine vom W3C deklarierte Sprache zur Ausgabeformatierung von strukturierten Dokumenten wie zum Beispiel HTML und auch XML. CSS steht für Cascading Stylesheet. Stylesheet bedeutet so viel wie Formatvorlage. Cascading, kaskadierend, bezieht sich darauf, dass auf einzelne Elemente mehrere auch unterschiedliche Formatierungsvorschriften wirken können, die in hierarchischer Reihenfolge, wie eine Kaskade, vom Browser ausgewertet werden und letztlich die Formatierung im Zusammenspiel festlegen. CSS ist die Formatierungssprache für Webseiten. Der Einsatz von CSS bietet viele Vorteile, denn CSS ermöglicht eine strenge Trennung von Inhalt und Layout: Damit lassen sich Webseiten besser warten und leichter aktualisieren. Weil alle Informationen zum Layout der HTML-Seiten zentral in einer CSS- Datei gespeichert werden, lässt sich eine Website, die z. B. aus mehreren hundert Seiten besteht, mit wenig Zeitaufwand komplett umgestalten. Der Webdesigner muss lediglich in der CSS-Datei seine Änderungen vornehmen und sobald er diese speichert, sind alle HTML- Seiten bereits umgestaltet. Ein Stylesheet kann Richtlinien für Position, Schriftgröße, Schriftart, Hintergrundfarbe und bild, Höhe, Breite und vieles mehr enthalten. Arten von CSS-Stilen Interne CSS-Stile: werden im Head-Bereich des HTML Dokuments definiert und gelten nur in diesem einen Dokument. Sinnvoll für die Formatierung eines einzelnen Dokuments für besondere Verwendungszwecke. Externe werden in einer eigenen CSS-Datei definiert und über einen Link innerhalb des <head> Bereiches zur Geltung gebracht. Eberhart 1.css.einstieg.docx 2
3 STYLE CSS-Formatierung einleiten Damit die Formatierung per CSS in ein HTML-Dokument integriert werden kann, sind einige zusätzliche Befehle nöig. Der grundlegende Befehl lautet <STYLE>. Er muss geöfnet und geschlossen werden. Meist ist es üblich, dem Befehl über das Attribut TYPE noch mitzuteilen, dann nun CSS-Befehle in Textform erfolgen. Anwendung: NUR bei internen CSS-Formatierungen wenn man im Header CSS deklariert: In HTML5 kann der Type weggelassen werden: type= text/css 1) <style type= text/css > Formatierung. </style> 2) wenn man Elemente direkt formatiert: <p style= color:red; > Wird jedoch eine externe CSS-Datei in eine HTML-Datei eingebaut, muss dies über einen einfachen Link im Bereich <head> erfolgen, wobei der Befehl nicht mehr <style> sondern <stylesheet> lautet: <head> <link rel= stylesheet href= layout.css > </head> In diesem Beispiel haißt die externe CSS-Datei layout.css. Externe CSS-Datei: Regeln Die Endung der Datei muss zwingend.css lauten, sonst wird sie von vielen Browsern nicht akzeptiert. Wie die Datei selbst heißt ist egal, z.b. layout.css, format.css. In der Datei darf außer CSS-Befehlen nicht stehen. Die einzige Ausnahme stellen Kommentare dar, welche anders als in HTML dargestellt werden. Der Kommentar muss von einem Slash und einem Stern eingeschlossen werden: /* Kommentar xyz */ Eberhart 1.css.einstieg.docx 3
4 UTF-8 Ein CSS-Datei beginnt immer mit der Definition des vorliegenden Zeichensatzes. Dieser legt fest, welche Schriftzeichen erlaubt sind und wie diese ausgeschrieben werden. Auf Nummer sicher geht man mit dem Zeichensatz utf-8, da dieser alle gängigen lateinischen Zeichen und Symbole beihaltet. Den Zeichensatz definiert man mit einer einfachen Zeile Code am Anfang der utf-8 ; Startet man eine neue CSS-Datei ist dies automatisch vorhanden. CSS-Datei erstellen Erstelle ein neues Dokument Datei / Neu und wähle die Vorlage css. Speicher das Dokument gleich neben der headline.html als mycss.css. In dieser Datei werden dann alle nötigen CSS-Eigenschaften Schritt für Schritt angelegt werden. Die Eigenschaften der einzelnen HTML-Elemente werden übersichtlich untereinander angeordnet. Eberhart 1.css.einstieg.docx 4
5 CSS-Syntax Eine CSS-Datei besteht aus Selektoren, die jeweils verschiedene Eigenschaften einem Element, einer Klasse, einer ID oder einer Kaskade zuweisen. Elemente werden bei ihrem Tag-Namen (z.b.: body, h1, h2, header) genannt, Klassen mit einem vorangestellten Punkt (z.b.:.class) und IDs mit einer beginnenden Raute (z.b.: #digbiz) gekennzeichnet. Für eine CSS-Formatierung sind immer drei Angaben notwendig: Element (Selektor) Eigenschaft (Attribut) hier wird angegben, welche Eigenschaft bei dem vorher ausgewählten Element verändert werden soll, z.b. Schriftgröße, Farbe. Wert hier erfolgt die tatsächliche Formatierung selbst. Hier wird z.b. die gewünschte Größe als Zahlenwert angegeben. Element { Eigenschaft:Wert; } Beispiel für einen Typselektor: h1 { color:black; } Info: Die Eigenschaft color legt die Schriftfarbe fest Wichtig ist dabei, dass das zu formatierende Element kleingeschrieben vor der geschweiften Klammer steht und durch ein Leerzeichen getrennt ist. Zwischen den Klammern und den darin enthaltenen Elementen sollten ebenfalls Leerzeichen gesetzt werden, weil viele Browser sich damit leichter tun. Die gewünschte Eigenschaft wird dann direkt notiert und mit einem Doppelpunkt (:) vom zugewiesenen Wert getrennt. Hier erfolgt kein Leerzeichen. Der Wert wird schließlich mit einem Semikolon (;) beendet. Dadurch wird die Wertzuweisung abgeschlossen und es kann die nächste folgen. Man kann auch mehrere Werte zuweisen, wenn sie mit einem Semikolon getrennt werden: h1 { color:black; font-size:30px; } Eberhart 1.css.einstieg.docx 5
6 oder untereinander: h1 { } color:black; font-size:30px; Somit lässt sich jedes HTML-Element formatieren. Einen vollständige Aufbau wie oben nennt man eine REGEL. In jeder Regel können beliebig viele Deklarationen enthalten sein, die wiederum aus Eigenschaftsbezeichnungen und einem Wert bestehen. Als Deklaration (Anweisung) bezeichnet man immer die Kombination aus einer Eigenschaft und einem Wert: Beispiel: color: red; Bestimmte häufig verwendete Eigenschaften (Attribute): font-size - gibt die Größe der Schrift an font-family - legt die Schriftart fest; ist eine Schriftart nicht installiert, wird automatisch die zweite oder dritte verwendet. Beachte: der Name muss direkt hinter dem Doppelpunkt stehen. Nur wenn der Name aus mehreren Wörtern besteht, muss man zwingend einfache (besser als doppelte) Anführungszeichen erwenden. Beispiel: p { font-family:calibri, Arial Black ; } Man kann auch generel diese schreibweise nutzen: font: Helvetica, sans-serif; font-weight - steht für Fettdruck, der sich stufenlos variieren lässt background-color - Hintergrundfarbe background-image:url(...jpg) text-align:center - legt man die Ausrichtung des Textes oder des jeweils deklarierten Objektes fest, hier zentriert margin - äußerer Abstand von Objekten zu anderen Objekten, erstellt einen Abstand zum Browserfensterrand dadurch werden sämtliche Inhalte, die sich innerhalb des <body>-tags befinden, von allen Richtungen um diesen Wert eingedrückt. Beispiel: margin:25px padding - innerer Abstand des Objekts zu seinem eigenen Rand Eberhart 1.css.einstieg.docx 6
7 width - Breite eines Objektes height - Höhe eines Objektes Beispiel: soll ein großes Bild auf eine bestimmte Breite gebracht werden, aber die Höhe soll angepasst und nicht falsch skaliert werden, verwende für height:auto img { width:250px; height:auto; } border erwartet drei Werte: die Rahmenstärke, die Rahmenart und die Rahmenfarbe. Beispiel: border: 1px solid red; Es lassen sich aber auch die Rahmenseiten einzeln definieren: z.b.: border-bottom: 1px solid green; background-image damit definiert man einen Dateipfad, der auf das Hintergrundbild verweist. Mit background-repeat definiert man ob und wie der Hintergrund wiederholt werden soll. Möglich sind die Eigenschaften repeat, repeat-x und repeat-y für die Wiederholung in eine Richtung und no-repeat, falls der Hintergrund nur einmal angezeigt werden soll. Beispiel: background-image: url(img/bg.jpg) repeat center; (Kurzschreibweise) background-size Damit kann man die größe des Bildes in Pixel definieren. Die Werte contain und cover sind wichtig: contain: auf die Größe des Elements gezogen cover: automatische Anpassung, dass das komplette Element davon bedeckt (cover) wird Groß- und Kleinschreibung Wird in CSS nicht beachtet. Einfachheitshalber werden alle Wörter kleingeschrieben. Angabe der Schriftgrößeneinheit: Bei der Angabe von Werten und dem entsprechenden Maß ist es wichtig, dass zwischen diesen kein Leerzeichen vorhanden ist, sondern die Werte wie folgt angegeben werden: 16px oder 160% - falsch: 16 px oder 160 % Eberhart 1.css.einstieg.docx 7
8 Farben mit CSS Farben werden in CSS als Hexadezimalwert definiert. Der Hex-Wert repräsentiert die Werte für Rot, Grün und Blau im RGB-Modell als Hexadezimalwerte zwischen 00 und FF. Die Farbe # steht dabei für ein tiefes Schwarz, #FFFFFF wäre entsprechend ein Reinweiß. Rot lässt sich als #FF0000 abbilden, also als voller Rotwert, kein grün, kein Blau. CSS erlaubt das Arbeiten mit Farbnamen. Beispiel: p { color: red; } Am Bildschirm werden alle Farben aus Rot, Grün und Blau gemischt. Zur Definition der jeweiligen Farbanteile gibt es in CSS zum Beispiel folgende Möglichkeiten: Hexadezimal, normal: #rrggbb (rot rot grün grün blau blau) Nach der Raute kommen jeweils zwei Zeichen für Rot, Grün und Blau. Knallgelb ist in dieser Schreibweise zum Beispiel #ffff00: So viel Rot und Grün wie möglich und überhaupt kein Blau. Hier ein paar einfache Merkhilfen: o ff steht für folles Fund.»Alle drei Farben auf folles Fund«ist Weiß: #ffffff o 00 (Doppelnull) steht für Licht aus.»alle drei Farben aus«ist Schwarz: # Hexadezimal, kurz: #rgb Knallgelb ist #ff0. Jedes Zeichen wird gedoppelt. Diese Schreibweise ist praktisch, funktioniert aber natürlich nur für bestimmte Farbwerte. Wie kommt man zu den Farbwerten in Hexadezimal-Angabe? Natürlich mit Photoshop aber auch auf der Website Eberhart 1.css.einstieg.docx 8
9 Farbangaben können in CSS auf unterschiedliche Weise angegeben werden. Innerhalb einer CSS-Datei muss man sich nicht für eine bestimmte Schreibweise entscheiden. Man kann alle Varianten beliebig verwenden. 1. Farbnamen (color keywords) Farbnamen sind nicht case-sensitiv. Der Standars definiert folgende Basisfarbnamen: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white und yellow. Darüber hinaus sind erweiterte Farbnamen definiert. Eine Liste findet man hier: 2. Hexadezimal-Farbangaben Eine Farbangabe über Hexadezimalwerte legt das RGB-Farbmodell zu Grunde. Die Angabe beginnt mit einer Raute (#) und wird von sechs Zeichen gefolgt. Dabei stehen die Zeichen eins und zwei für den Rotwert, drei und vier für den Grünwert sowie fünf und sechs für den Blauwert. Bsp.: <font color= #3399FF > hellblau</font> 33 Rotanteil, 99 Grünanteil, FF Blauanteil Eine Besonderheit stellt hier die Kurzform dar. Haben jeweils alle Rot-, Grün- und Blauwerte denselben Wert, kann die Angabe von sechs auf drei Zeichen reduziert werden: color: #006699; kann man abkürzen mit color: #069; Farb-Verläufe Ein Farbverlauf wird in der background -Definition mit linear-gradient() festgelegt. Diese erwartet mindestens drei Eigenschaften: die Verlaufsrichtung eine Startfarbe und eine Endfarbe Beispiel: background: linear-gradient(to top, #FF5E3A, #FF2A68); Komplexere Verläufe können hier organisiert werden: Eberhart 1.css.einstieg.docx 9
10 Einbinden der Stylesheets Innerhalb von HTML und CSS gibt es unterschiedliche Wege, Elemente mit Stilanweisungen zu versehen. Der Regelfall besteht darin, Stylesheets als externe Dateien zu definieren und im Bereich des HTML-Headers in die Webseite einzubinden. Übung: erstelle und speichere zwei neue Dateien namens einstieg.html und layout.css Die einstieg.html hat folgenden Code: <!doctype html> <html> <head> <meta charset="utf-8"> <title>einstieg</title> <link rel="stylesheet" href="layout.css" /> </head> <body> <h1>css Klassen unds IDs bearbeiten</h1> <p>du kannst jederzeit eigene Selektoren für Klassen erfinden</p> <br> <p>mit IDs kann man genau einmal etwas formatieren.</p> </body> </html> layout.css: ist noch leer Erklärung externe Verlinkung: <head> <link rel= stylesheet type= text/css href= layout.css /> </head> Eberhart 1.css.einstieg.docx 10
11 In HTML5 kann der Type weggelassen werden: type= text/css Erklärung: rel steht für relation type es ist eine Textdatei vom Untertype CSS Vorteile: Die Vorteile dieser Art der Einbindung liegen auf der Hand. Die Trennung von Inhalt und Layout wird optimal umgesetzt. Dabei enthält ein HTML- Quelltext nur noch die Inhalte sowie Elemente zur strukturellen Gliederung der Seite. Das eigentliche Layout, die Vorgaben zur Gestaltung der einzelnen Bereiche, findet sich in einem externen Stylesheet. Die Größe des Quelltextes wird dadurch verringert. Zudem werden Stylesheets vom Browser im Cache gespeichert und müssen daher für die Verwendung auf der gesamten Webseite nur ein einziges Mal geladen werden. Der andere, aber ungünstigere Weg sind die so genannten INLINE-CSS, also die direkte Formulierungen innerhalb des einzelnen HTML-Quellcodes. Eberhart 1.css.einstieg.docx 11
12 Klassen und IDs a)class Oben haben wir uns mit Typselektoren beschäftigt, die einzelne Typen (z.b. h1) regeln. Manchmal sollen Anweisungen nicht pauschal allen Elementen einer Sorte zugewiesen werden, sondern nur einigen ausgewählten. Weil sie, als Untergruppe, quasi als eigene Klasse bezeichntet werden können, erhalten sie ein Attribut: class. Eine Klassen-Regel (englisch class ) beginnt im CSS-Dokument immer mit einem Punkt. Übung: Erstelle in der oben angelegten layout.css eine erste Klasse und speichere diese: Gelbe Schrift auf rotem Hintergrund. Das wird wehtun?! Die Zuweisung in der HTML-Datei erfolgt direkt im Tag. Speichere und betrachte das Ergebnis in Firefox: Eberhart 1.css.einstieg.docx 12
13 b)id-selektor Der ID-Selektor wirkt immer genau auf ein Element, das ein id-attribut mit dem übergebenenen Bezeichner besitzt. Hierfür wird der ID-Wert mit vorangestelltem Hash- Zeichen eingesetzt. Beachte: Man kann Klassen beliebig oft einsetzen und ansprechen. IDs hingegen dürfen genau einmal vorkommen. Übung: Erstelle in der layout.css eine ID namens #impressum: Statt eines Punktes setzte eine RAUTE: Die Einbindung erfolgt in der einstieg.html für den zweiten Paragraf <p>: Das Ergebnis im Browser: ID ist die Abkürzung für Identität und im englischen auch für Personalausweis. Der Wert einer ID darf in der HTML-Datei nur einmal pro Seite vorkommen Eberhart 1.css.einstieg.docx 13
14 Info Block-Elemente: Block-Elemente wie <p> oder <div> erzeugen um sich herum automatisch einen Rahmen. Grundsätzlich sind alle Elemente rechteckig. Wenn man den Rahmen sehen würde, sehen diese Elemente wie Kisten aus. Dank dieser Tatsache lässt sich die Gestaltung auf drei Ebenen aufteilen: 1. Anordnung der Kisten: Wo soll man diese auf der Website platzieren? Wie sieht der Aufbau der Seite aus? 2. Gestaltung der Kisten: Welche Rahmenart, -dicke, und farbe will man? Welche Abstände sollen eingehalten werden? 3. Inhalt der Kiste: Welche Schrift, Schriftgröße und Schriftfarbe wählt man? Beispiele: <div> und <p> Sind sogenannte Block-Elemente und sie veranlassen somit autmatisch einen Zeilenumbruch. Der feine Unterschied zwischen den beiden ist, dass <p> vor und nach dem Absatz eine Leerzeile einfügt, <div> dagegenen nicht. Das <div> wird daher als Conatiner-Element genutzt, also als eine Art Hülle. Es bietet sich somit an, um andere Elemente zusammenzufassen und wie ein Behälter zu umschließen. <span> Mit <span> kann man sehr gut ein einzelnes Wort oder sogar einzelne Zeichen gestalten. Es ist kein Block-Element, sondern ein INLINE-Element und erzeugt daher auch keinen Zeilenumbruch. Die Unterscheidung zwischen Block- und Inline-Elementen ist sehr wichig. Es wäre nicht richtig, wenn man z.b. ein Wort gestalten möchte und dafür ein Block-Element verwenden würde. Nach dem Wort würde eine neue Zeile entstehen und das wäre wohl nicht gewünscht. Unterschiede: Blockelemente werden so breit, wie es geht Blockelemente ähneln Absatzformaten in Word: Der Kasten eines Blockelements wird automatisch so breit, wie es geht. Nachfolgende Elemente stehen unterhalb des Kastens in der nächsten Zeile. Blockelemente enthalten normalen Text, Inline-Elemente und manchmal auch andere Blockelemente. Eberhart 1.css.einstieg.docx 14
15 Beispiele für Blockelemente sind die Überschriften h1 bis h6, Fließtextabsätze mit p sowie die Listenelemente ul, ol und li. Inline-Elemente werden nur so breit wie ihr Inhalt Inline-Elemente ähneln den Zeichenformaten aus Word: Der Kasten eines Inline-Elements wird nur so breit wie sein Inhalt. Nachfolgender Text fließt direkt nach dem Element weiter. Inline-Elemente erzeugen keine neue Zeile und sind den Blockelementen untergeordnet. Sie dürfen normalen Text und andere Inline-Elemente enthalten, aber keine Blockelemente. Beispiele für Inline-Elemente sind strong und em sowie Hyperlinks (a) und Grafiken (img). Eberhart 1.css.einstieg.docx 15
16 CSS Quick-Info Übung: Erstelle ein neues HTML-Dokument einstieg.html und dazupassend ein layout.css. Bilder mit runden Ecken Prinzipiell hat border-radius vier Werte. Diese stehen für die vier Ecken in folgender Reihenfolge: oben links, oben rechts, unten rechts und unten links. Die Angaben werden also im Uhrzeigersinn gemacht. Beispiel: border-radius: 5px 20px 40px 60px; Wird nur ein Wert verwendet, beim Beispiel ganz oben border-radius:8px haben alle vier Ecken einen Radius von 8 Pixeln. Probiere ein rundes Bild Bild als Link inklusive Rahmen und abgerundetem Bild: Hover dazu: es erscheint ein Schatten als Hover-Effekt, wenn man mit der Maus drüberfährt: Eberhart 1.css.einstieg.docx 16
17 Tipp: Die Seite zentrieren mit margin: auto Text und Inline-Elemente kann man mit der Anweisung text-align: center zentrieren, aber für Blockelemente funktioniert das leider nicht. Da es keinen Befehl wie»zentriere ein Blockelement auf der Seite«gibt, benutzt man einen kleinen Trick: Wenn die Außenabstände (margin) für links und rechts auf automatisch gesetzt werden, sind sie immer gleich groß. Wenn die Außenabstände links und rechts gleich groß sind, ist das Element zentriert. Listen formatieren Mithilfe der folgenden Eigenschaften kann man das Aussehen von Listen gestalten: list-sytel-type: gültige Werte für unsortierte Listen (ul) sind: disc gefüllter Kreis none keine Aufzählungszeichen circle ungefüllter Kreis square gefülltss Quadrat Background bzw. Listenpunkte background-color: Mit CSS wird die Farbe in 3 Arten definiert: HEX-Wert: #ff0000 RGB-Wert: rgb(255,0,0) Ein gültiger Farbenname: red background-image: Eberhart 1.css.einstieg.docx 17
18 Das Bild wird sooft wiederholt, bis das betreffende Element (z.b. body) bedeckt ist. Ist es zu klein, kann schnell eine unerwünschte Situation entstehen: Grafik für Listenpunkte: list-style-image: url(./img/bullet.png ); Es wird das Schlüsselwort url erwartet, wie beim Hintergrund, die Grafik selbst wird in Klammern mit einfachen oder doppelten Anführungszeichen angegeben. Hintergrundmuster mit CSS3 erstellen Inkl: CSS-Code: Eberhart 1.css.einstieg.docx 18
Übung: Bootstrap - Navbar
Übung: Bootstrap - Navbar Angaben befinden sich im Ordner: 5_Übung_nav. Darin befinden sich die Bootstrap-Ordner und die dazu passende index.html, die bereits die Links zu den Ordnern enthält. Aufgabe:
Inhaltsverzeichnis. Florian Bauer CSS Seite 2 von 10
CSS Inhaltsverzeichnis Gestaltung mit CSS... 3 CSS einbinden... 3 On the fly... 3 Im Header... 3 In einer externen Datei... 3 Aufbau einer CSS Anweisung... 4 Wichtige CSS Eigenschaften... 4 Pseudoelemente...
1 Definition der Selektoren Einbinden der CSS 3 Möglichkeiten Farbangaben Schriftformatierung Abstände...
CSS GRUNDLAGEN 1 Definition der Selektoren... 2 2 Einbinden der CSS 3 Möglichkeiten... 2 3 Farbangaben... 4 4 Schriftformatierung... 4 5 Abstände... 4 6 Box Modell... 5 7 Links... 5 8 Eigene Klasse definieren...
Farben sind im Webdesign wichtig z.b. für die Schriftfarbe oder den Hintergrund.
Layout: Farben Farben sind im Webdesign wichtig z.b. für die Schriftfarbe oder den Hintergrund. Farben festlegen: Schriftfarbe: color:red Hintergrund: background-color: #ff0000 Die Farbe kann entweder
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
CSS. Cascading Style Sheets
CSS Cascading Style Sheets Was ist CSS? CSS... steht für Cascading Style Sheets... definiert die Darstellung (Farben, Fonts,... ) von (HTML) Dokumenten auf Web-Seiten.... spart viel Aufwand, da Format-Regeln
Allgemeine Technologien II Wintersemester 2011 / November 2011 CSS
Allgemeine Technologien II Wintersemester 2011 / 2012 28. November 2011 CSS Themen 28.11.2011 Cascading Style Sheets CSS CSS einbinden Inline-Styles CSS im Dokumentkopf Externe Stylesheets Konzepte Typen-,
E-Commerce: IT-Werkzeuge. Web-Programmierung. Kapitel 3: Webdesign mit CSS Stand: Übung WS 2015/2016. Benedikt Schumm M.Sc.
Übung WS 2015/2016 E-Commerce: IT-Werkzeuge Web-Programmierung Kapitel 3: Stand: 30.10.2015 Benedikt Schumm M.Sc. Lehrstuhl für ABWL und Wirtschaftsinformatik Katholische Universität Eichstätt-Ingolstadt
CSS - Cascading Stylesheets
CSS - Cascading Stylesheets Alfred Beringer HTBLVA für Textilindustrie und Datenverarbeitung Alfred Beringer 1 Überblick Kurze Einführung Deklarationen Selektoren Beispiele Alfred Beringer 2 CSS Formatierungssprache
Grundlagen-Beispiel CSS
Grundlagen-Beispiel CSS Öffne im Ordner 2.css.uebung die vorhanden Dateien index.html und erstelle eine neue CSS-Datei mit dem Namen bildschirm.css. Füge im Bereich folgende Verlinkung ein:
4. Briefing zur Übung IT-Systeme
4. Briefing zur Übung IT-Systeme - Einführung in HTML, CSS und JavaScript Fragestunde,, PC Pool Stand und Ausblick Einführung: 18.10.2016, 12.00 Uhr (c.t.), HS 4/PC Pool Fragestunde: 09.11.2016, 12.00
4. Briefing zur Übung IT-Systeme
4. Briefing zur Übung IT-Systeme - Einführung in HTML, CSS und JavaScript Fragestunde, 18.12.2017, PC Pool Stand und Ausblick Einführung: 17.10.2017, 12.00 Uhr (c.t.), HS 4 Fragestunde: 06.11.2017, 10.15
Eine Schnelleinführung in CSS
Eine Schnelleinführung in CSS Michael Dienert 11. September 2013 Inhaltsverzeichnis 1 Was ist CSS? 1 2 Verwenden der CSS-Stylesheets 2 3 Struktur eines CSS-Stylesheets 2 4 Selektoren im Detail 3 4.1 Verwandschaftsbeziehungen:
3. Briefing zur Übung IT-Systeme
3. Briefing zur Übung IT-Systeme - Einführung in HTML, CSS und JavaScript Fragestunde, 30.11.2016, PC Pool Stand und Ausblick Einführung: 18.10.2016, 12.00 Uhr (c.t.), HS 4/PC Pool Fragestunde: 09.11.2016,
Allgemeine Technologien II Sommersemester Mai 2011 CSS
Allgemeine Technologien II Sommersemester 2011 02. Mai 2011 CSS Kursthemen Designparadigmen Framesets Tabellenbasierte Layouts -basierte Layouts: CSS & Co. Cascading Style Sheets CSS CSS einbinden
Formatierung eines Text Ads in CSS
Formatierung eines Text Ads in CSS Damit sich die Text Ads möglichst harmonisch in Ihre Webseite einfügen, haben Sie verschiedene Möglichkeiten Ihr Text Ad über CSS (Cascading Style Sheets) zu formatieren.
Introduction to Technologies for Interaction Design. Stylesheets
Introduction to Technologies for Interaction Design Stylesheets Syntax Selektor und Eigenschaften Selektor bezieht sich auf ein HTML-Element ID-Selektoren dürfen in jeder HTML-Datei nur einmal vorkommen
ANWENDUNGSSOFTWARE CSS
ANWENDUNGSSOFTWARE CSS NAVIGATION Bilder zur Navigation: als Anker für Verweise benutzen Text sollte nicht Bestandteil des Bildes sein (Bild als Hintergrund), siehe z-index Navigationslisten mit ,
ALLGEMEINES WOMIT KANN ICH WEBSITES ERSTELLEN?
HTML AG INHALT Allgemeines... 2 Womit kann ich Websites erstellen?... 2 Grundgerüst von HTML... 3 Tags und Attribute... 3 Links... 4 Links auf andere Seiten... 4 Bilder... 5 meta-tags... 5 Webseiten mit
Übung: Überschriften per CSS gestalten
Übung: Überschriften per CSS gestalten Teil 1: Umsetzung eines Layouts mit zwei Überschriften mit zwei verschiedenen Hierarchieebenen, ergänzt durch einen beschreibenden Textabsatz. Teil 2: Wie Teil 1,
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
3. Briefing zur Übung IT-Systeme
3. Briefing zur Übung IT-Systeme - Einführung in HTML, CSS und JavaScript Fragestunde, 30.11.2016, PC Pool Stand und Ausblick Einführung: 18.10.2016, 12.00 Uhr (c.t.), HS 4/PC Pool Fragestunde:, 12.00
Inhalt: 1)Das Box-Modell
Inhalt: 1. Das Box-Modell 2. Reset-CSS 3. CSS-Eigenschaft: position (static, relative, absolute) 4. CSS-Eigenschaft: float, clear 5. Übung 6. Die Seite zentrieren mit margin:auto 1)Das Box-Modell Die Box
<html> <head> <title> Die Welt der Bäume </title> </head> <body> Hier ensteht eine Seite über Bäume. </body> </html> Abb. 2
Dieser html-kurs soll die Informatik-SchülerInnen meines Info-Kurses auf den Info-Quali vorbereiten. Das Werkzeug html soll einen in die Lage versetzten, die Programmierung von Web-Seiten zu verstehen
1. Einstieg 2. Selektoren 3. Schriften 4. Strukturen 5. Zwischenräume, Abstände 6. Bilder 7. Farben 8. Beispiel
Inhalt 1. Einstieg 2. Selektoren 3. Schriften 4. Strukturen 5. Zwischenräume, Abstände 6. Bilder 7. Farben 8. Beispiel Einstieg - Eine Formatvorlage besteht aus mindestens einer Anweisung. - Eine Anweisung
Aufbau einer HTML Seite:
1 Aufbau einer HTML Seite: Grundstruktur: Head Bereich: "nicht sichtbar" Er enthält grundlegende Informationen wie: Title, Charset, Ansichtsgröße,
Kennen, können, beherrschen lernen was gebraucht wird
Inhaltsverzeichnis Inhaltsverzeichnis... 1 Zeichen formatieren... 1 Physische Formatierungen... 1 Zitate auszeichnen... 2 Schrift ändern... 2 Die Schriftgröße einstellen... 2 Die Schriftart einstellen...
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
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,
Inhalt. 1 Mit CSS beginnen 1. 2 Textauszeichnungen und andere Grundlagen 13
D3kjd3Di38lk323nnm xiii 1 Mit CSS beginnen 1 1.1 Formate definieren mit CSS......................... 1 1.1.1 lnline-formate............................. 3 1.1.2 Eingebettete Formate........................
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,
Umsetzen einer skalierbaren horizontalen Navigation:
Umsetzen einer skalierbaren horizontalen Navigation: Erstelle im Dreamweaver eine neue HTML - Datei (navigation.html) und eine CSS Datei (navigation.css). Die Struktur dieser Navigation soll auf einer
Der CSS-Problemlöser
Rachel Andrew Der CSS-Problemlöser Über 100 Lösungen für Cascading Stylesheets 2., überarbeitete und aktualisierte Auflage «j dpunkt.verlag Inhalt 1 Mit CSS beginnen 1 1.1 Formate definieren mit CSS 1
Abgabetermin: , 23:59 Uhr
HTML 19.01.2016 Projektanforderungen Struktur: Zentrale (index-)seite Sinnvolle Ordnerstruktur von index.html aus verlinkte Seiten mit Querverweisen (insgesamt mindestens 3 Seiten) Elemente, die irgendwo
12. Jgst. 3. Kursarbeit Datum: Fach: Informationsverarbeitung (Leistungskurs) & )!!*+,!- -.!-
12. Jgst. 3. Kursarbeit Datum: 26.03.2007 Klasse: GY 05 c Fach: Informationsverarbeitung (Leistungskurs) Themen: XHTML; CSS Name: Bitte speichern Sie Ihre Ergebnisse regelmäßig. Punkte:!" # Note: 8 $ %!&'(
[Guide] CSS (+ CSS 3!) Inhaltsverzeichnis. Vorwort
![[Guide] CSS (+ CSS 3!) Inhaltsverzeichnis. Vorwort](/thumbs/92/108574680.jpg "[Guide] CSS (+ CSS 3!) Inhaltsverzeichnis. Vorwort")
[Guide] CSS (+ CSS 3!) Vorwort CSS in HTML einbinden HTML mit CSS ansprechen Farben Jetzt geht es los: Normales Stylen Boxen (DIVs) mit dem Boxmodel Fliessende Boxen Links formatieren & Pseudoklassen/Elemente
HTML: Text und Textstruktur mit CSS gestalten
Tutorium HTML: Text und Textstruktur mit CSS gestalten Martin Stricker martin.stricker@rz.hu-berlin.de 23. Juni 2004 Schriftarten und generische Schriftfamilien Schriftarten werden mit font-family definiert
Tutorial zum erstellen einer Webseite
Tutorial zum erstellen einer Webseite 2. Teil das Aussehen mit CSS bestimmen Vorbereitungen: Die HTML Grundlage anpassen, Änderungen sind fett geschrieben. Ab sofort werden wir mit zwei Dateien arbeiten,
Funktionen in JavaScript
Funktionen in JavaScript Eine Funktion enthält gebündelten Code, der sich in dieser Form wiederverwenden lässt. Mithilfe von Funktionen kann man denselben Code von mehreren Stellen des Programms aus aufrufen.
Tabellenfreies Layout in HTML
Tabellenfreies Layout in HTML 0. Inhaltsverzeichnis Philipp Wahle 12.12.12 2 von 40 Seiten 3 von 40 Seiten 0. Inhaltsverzeichnis 1. Sematischer Code 2. Box Modell 3. Classes & IDs 4. Statischer Seitenaufbau
Web-basierte Anwendungssysteme XHTML- CSS
Web-basierte Anwendungssysteme XHTML- CSS Prof. Dr. Sergej Alekseev (alekseev@fb2.fra-uas.de) Prof. Dr. Armin Lehmann (lehmann@e-technik.org) Fachbereich 2 Informatik und Ingenieurwissenschaften Wissen
Navigationsmenü im Stil von Registern
Navigationsmenü im Stil von Registern Navigationsmenüs in Registeroptik erfreuen sich großer Beliebtheit. Wie man solche Menüs erstellt und welche Variationsmöglichkeiten es gibt, soll im Folgenden beschrieben
Kennen, können, beherrschen lernen was gebraucht wird
Inhaltsverzeichnis Inhaltsverzeichnis... 1 Tags (Befehle)... 1 Erste Texte im Browser... 2 Das HTML Grundgerüst... 2 Ihre erste echte Webseite... 2 Texte... 3 Textabsatz und Zeilenumbruch... 3 Einen Zeilenumbruch
33 CSS in HTML einbinden
D3kjd3Di38lk323nnm 256 33 CSS in HTML einbinden Damit CSS auf HTML wirken kann, muss eine Verknüpfung hergestellt werden. Dafür stehen verschiedene Möglichkeiten zur Verfügung, die in diesem Kapitel beschrieben
Hintergrundbilder. background-image. Werte: URL (Standort des Bildes) none inherit. Standard: none. Gilt für: alle Elemente.
HTML 8 Vorbereitung Hintergrundbilder background-image Werte: URL (Standort des Bildes) none inherit Standard: none Gilt für: alle Elemente Vererbung: nein => URL ist relativ zur Stylesheet-Datei anzugeben!
3 XML, HTML und XSL die Ausgabe
3 XML, HTML und XSL die Ausgabe XML und VBA lernen ISBN 3-8273-1952-8 Nun, nachdem eine wohlgeformte oder eine gültige XML-Datei erstellt worden ist, stellt sich die Frage, was mit ihr geschieht. Die Anzeige
Richtlinien für das Design der KML Webseite. KML TP2, Informationsdienste
Richtlinien für das Design der KML Webseite KML TP2, Informationsdienste Inhaltsverzeichnis 1. Einleitung...1 2. Textgestaltung...1 2.1. Absätze...1 2.2. Überschriften...2 2.3. Grafiken...2 3. Besondere
Webdesign im Tourismus
Übung Prof. Dr. Markus Landvogt Zur Vorlesung 2.3. Feinheiten in Jimdo 2.4. HTML in Jimdo 03 HTML - GRUNDLAGEN DER ERSTELLUNG VON WEBSEITEN 3.1 Aufbau einer Seite in HTML 3.2 HTML in Jimdo WEB 03 1 2.3.
Computergrundlagen HTML Hypertext Markup Language
Computergrundlagen HTML Hypertext Markup Language Axel Arnold Institut für Computerphysik Universität Stuttgart Wintersemester 2014/15 Ausgabemedien und Beschreibungssprachen Papier: L A T E X feste Seitengröße
HTML5. Grundlagen der Erstellung von Webseiten. Marc Haunschild. 4. Ausgabe, 1. Aktualisierung, Mai 2017 ISBN HTML5
HTML5 Marc Haunschild 4. Ausgabe, 1. Aktualisierung, Mai 2017 ISBN 978-3-86249-701-0 Grundlagen der Erstellung von Webseiten HTML5 4 Erste optische Anpassungen mit CSS 4 4. Erste optische Anpassungen mit
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
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
Inhalt HTML 2. Applets Frames Formulare CSS cascading style sheets. Lehrveranstaltung Internet in AT Dr.-Ing. A. Braune TECHNISCHE UNIVERSITÄT DRESDEN
Inhalt HTML 2 Applets Frames Formulare CSS cascading style sheets SS 06 1 Applets Das Applet Java Applets sind kleine Java-Programme mit deren Hilfe aktive Webseiten erstellt werden können. werden mit
HTML - Die Sprache des Internets. Grundlagen und Kurzprojekt
- Die Sprache des Internets Grundlagen und Kurzprojekt aus der Presse: Definition : Hypertext Markup Language Sprache des WWW definiert: Text- und Absatzformate Links Bild- und Tonelemente Farben offener
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
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
Erstelle eine neue Datei unter dem Namen stylesheet.css und speichere es im selben Verzeichnis, in dem auch die vier HTML-Dokumente liegen.
CSS3 Erstelle eine neue Datei unter dem Namen stylesheet.css und speichere es im selben Verzeichnis, in dem auch die vier HTML-Dokumente liegen. Klicke auf Menü Datei und dann Neu. Wähle CSS und dann erstellen
Fließlayout. »World of Fish«
Fließlayout 4»World of FishWorld of Fish«stellt ein kleines Informationsangebot zu einem begehbaren Aquarium dar, und dieses Angebot soll von uns umgesetzt werden. Im Vorfeld haben wir wie immer ein Konzept
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
-Wählen Sie die gewünschten Kriterien für die Selektion und klicken Sie anschließend auf OK um die Datensätze zu selektieren.
HowTo: Personalisierte Serienemails aus Selektion (ggf. mit Anhang) Versionen: CRM 5, CRM SIX I. Vorbereitung a) Erstellen einer Selektion -Grundlage für alle Serienbriefe oder Serienemails mit SuperOffice
PresseBox Presseticker
PresseBox Presseticker Version 1.0 letzte Aktualisierung: 09.04.2013 2013 unn UNITED NEWS NETWORK GmbH, Karlsruhe Inhaltsverzeichnis Einführung... 3 Standard-Ticker... 3 Flying-Ticker... 3 Extended-Ticker...
Inhalt. Seite 1 von 14
Seite 1 von 14 Inhalt 1. Php ansprechen... 2 2. html... 3 3. Weitere Formatierungen in html... 5 4. Tabellen mit html... 6 a. Grundstrukturen... 6 b. Tabellen formatieren... 11 Seite 2 von 14 1. Php ansprechen
Nachbau der Website 1.)Hintergrundbild einfügen eigene CSS-Datei
Nachbau der Website http://www.lake-festival.at/ Erstelle eine neue Bootstrapsite im Ordner lakefestival. Es soll alle Ordner bereits enthalten, back für diverse backgrounds, img mit vielen Bildern usw.
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
Modernes Webdesign mit HTML und CSS
Modernes Webdesign mit HTML und CSS Webseiten sind nicht aus Papier! Das klassische Printmedium baut auf bekannten Größen auf, z. B. dem Seitenverhältnis und den Abmessungen definierter Blattformate. Auch
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
Webdesign-Multimedia HTML und CSS
Webdesign-Multimedia HTML und CSS Thomas Mohr 1 HTML 1.1 Was ist HTML? HTML steht für Hypertext Markup Language und ist eine Auszeichnungssprache zur Strukturierung digitaler Dokumente. HTML-Dokumente
Mitschrift HTML. Dateinamen von Bildern: nur Kleinbuchstaben ohne Umlaute und Sonderzeichen BSP: auto.jpg fruehling.jpg bild_01.
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
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
Wir studieren HTML-Tags
Abb. 1: Word-Dokument Abb. 2: Das Dokument aus Abb. 1 mit einem Editor betrachtet Wir studieren HTML-Tags Wenn man ein Word-Dokument wie in Abb. 1 mit einem Editor anschaut, erkennt man den Quelltext des
HTML & CSS. Beispiele aus der Praxis
HTML & CSS Beispiele aus der Praxis Übungsblatt 2 http://www.uni-koblenz.de/~ugotit Fragen? Wiederholung Beispiele von.../~ugotit/test/index.htm zu.../~ugotit/test2/html/index.htm Absoluter Pfad relativ
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
Fachcurriculum ITG Albert-Schweitzer-Gemeinschaftsschule Klassenstufe 9/10 H. Bauer. Thema Inhalte/Umsetzung Programme Lehrplanbezug.
Fachcurriculum ITG Albert-Schweitzer-Gemeinschaftsschule Klassenstufe 9/10 H. Bauer Thema Grundlagen der Erstellung von Webseiten Maximalplan 1 Was man wissen sollten 2 Die erste Webseite mit HTML erstellen
Seminar DWMX DW Session 002
Seminar DWMX 2004 DW Session 002 Mit Dreamweaver starten (1) Coder oder Designer eine Frage der Einstellung Bearbeiten/Voreinstellungen Kategorie Allgemein Arbeitsbereich ändern Bedienfelder und Bedienfeldgruppen
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:
Kommentare <! Dies ist ein Kommentar > Zum Kommentieren von Inhalten oder Befehlen. Wird im Browser nicht angezeigt.
HTML Grundgerüst titel der Seite Inhalt der Datei Innerhalb des Dateikopfes einen aussagekräftigen Titel vergeben! Den gesamten sichtbaren Inhalt
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
FUNKTIONSBESCHREIBUNG. IFRAME EINBETTUNG VERSION: ab
FUNKTIONSBESCHREIBUNG IFRAME EINBETTUNG VERSION: ab 2016.1.0 Inhaltsverzeichnis 1 Einleitung... 3 2 Schreibweise... 3 3 Zusätzliche Parameter... 4 3.1 Hintergrundfarbe... 4 3.2 Anzeige als Liste... 4 3.3
HTLM und CSS. Eine erste Einführung. Karlheinz Zeiner. Inhalt
HTLM und CSS Eine erste Einführung Karlheinz Zeiner Inhalt 1 Vorbereitung 1 1.1 HTML und CSS 1 1.2 Werkzeuge 1 1.3 Quellen 1 2 Erstes HTML-Dokument erstellen 2 2.1 Website, Webpage 2 2.2 Struktur einer
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
Digitale Medien. Übung zur Vorlesung. Vorlesung: Heinrich Hußmann Übung: Renate Häuslschmid
Übung zur Vorlesung Digitale Medien Vorlesung: Heinrich Hußmann Übung: Renate Häuslschmid Wintersemester 2016/17 Cascading Style Sheets HTML beschreibt nur den logischen Aufbau eines Dokuments. Die Gestaltung
CSS-Klassen am Beispiel von List-Definitionen
CSS-Klassen am Beispiel von List-Definitionen Jobst-Hartmut Lüddecke 10. Oktober 2011 Zusammenfassung Es werden verschiedene CSS-Definitionen für den Tag vorgestellt. Diese CSS-Definitionen sollten
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
Funktionen in JavaScript
Funktionen in JavaScript Eine Funktion enthält gebündelten Code, der sich in dieser Form wiederverwenden lässt. Es können ganze Programmteile aufgenommen werden. Mithilfe von Funktionen kann man denselben
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
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
Hyper. Text. Markup. Language
Hyper Text Markup Language Dateiname und-endung Wir schreiben mit dem Editor eine HTML-Quelldatei, diese endet immer auf Punkt html, also beispielsweise: hello-world.html Wir verwenden in unseren Dateinamen
Clubsite4Fun Administration:
Clubsite4Fun Administration: Farben und Schriftarten ändern Unser Fansite-Projekt macht Fortschritte: die Site präsentiert sich bereits mit neuer Kopfzeilengraphik und einem eigenen Logo. Irgendwie passt
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
4.8 Das Box Modell, Block- vs Inline-Elemente
4 Formatierung mit CSS Webdesignkurshandbuch:: :: :: :: :: :: :: :: :: :: :: :: Büchli :: Süsstrunk :: :: :: :: :: :: :: :: :: :: :: :: :: :: :: :: :: :: : 4.8 Das Box Modell, Block- vs Inline-Elemente
Digitale Medien. Übung
Digitale Medien Übung Pfadangaben Pfadangaben sind relevant für Bilder, Verweise, Medienobjekte per URL: Protokoll : / lokalernetzwerkname / Hostname : Port / Pfad http://www.mimuc.de/ http:/arbeitsgruppe/www.mimuc.de:8080
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
HTML-Grundlagen. Eine Einführung in HTML für Informatik TG 11
HTML-Grundlagen Eine Einführung in HTML für Informatik TG 11 HTML-Grundlagen Kapitel 1: Grundlegendes Benötigte Software Einen Texteditor, z.b. Microsoft Notepad WHYSIWY Editoren (Macromedia( DW) Einen
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
Es gibt immer einen Schlüssel und einen zugehörigen Wert,
JSON JavaScript Object Notation Im Unternehmenskontext spielt der Austausch von Daten zwischen unterschiedlichen Systemen eine große Rolle. Dabei müssen oft Technologie und Zuständigkeitsgrenzen überwunden
17. CSS - Cascading Style Sheets Kapitel 17: CSS
17. CSS - Cascading Style Sheets 17-1 Kapitel 17: CSS 17. CSS - Cascading Style Sheets 17-2 Inhalt 1. Einführung CSS 2. Farben, Hintergründe, Zeichensätze 3. Gruppierungen 4. Box-Modell 5. Validierung
CSS Einführung & CSS Frameworks
CSS Einführung & CSS Frameworks Leif Singer leif.singer@inf.uni-hannover.de Seminar Aktuelle Software-Engineering-Praktiken für das World Wide Web 14.04.2010 Frage Anfragen von Kommilitonen: mit reinsetzen
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:
index.html schwerpunkt HTML und Informationssysteme CSS - Cascading Style Sheets
CSS - Cascading Style Sheets Rechenzentrum Universität Stuttgart Maria Vass 26. April 2005 Gliederung: CSS Grundlagen CSS praktisch einsetzen CSS in HTML einbinden Schriften / Texte formatieren Listen,