Webtechnologien Teil 5: Cascading Style Sheets (CSS) - Teil II
|
|
|
- Roland Busch
- vor 5 Jahren
- Abrufe
Transkript
1 Webtechnologien Teil 5: Cascading Style Sheets (CSS) - Teil II
2 Überblick Farben Text Box-Modell Rahmen Hintergrund Tabellen Layer mit div Verschiedene Effekte 2
3 Farben I Farben werden nach dem Rot-Grün-Blau (RGB)-Modell als hexadezimale Zahlen angegeben oder als vordefinierte Namen. Schema: #RRGGBB mit 00 bis FF (256 Stufen) z. B. Weiß: #FFFFFF, Schwarz: #000000, Blau: #0000FF Nur Farben, die "websafe" sind, werden überall gleich dargestellt. Siehe auch: Eine Farbtafel lässt sich von herunter laden. 3
4 Farben II - Vordefinierte Bezeichnungen Quelle: 4
5 Farben III Die Farbe wird durch die RGB-Farbdefinition bzw. durch ein Schlüsselwort (wie bei HTML) ausgewählt. 3 Angaben in %: rgb(rrr.rr%,ggg.gg%,bbb.bb%) z.b. color: rgb(100%,0%,10%) 3 Dezimalwerte: rgb(rrr,ggg,bbb) z.b. color: rgb(255,0,25) 3 Dezimalwerte und Transparenz: rgba(rrr,ggg,bbb,ttt) z.b. color: rgb(255,0,25,0.5) 5
6 Beispiel <style type="text/css"> #H01 { color: rgb(100%,0%,30%); #H02 { color: rgb(255,0,75); #H03 { color: rgba(255,0,75,0.5); #H04 { color: rgba(255,0,75,0.2); </style> </head> <body> <h1 id="h01">das ist eine H1-Überschrift</h1> <h1 id="h02">das ist eine H2-Überschrift</h1> <h1 id="h03">das ist eine H3-Überschrift</h1> <h1 id="h04">das ist eine H3-Überschrift</h1> </body> 6
7 Schriften I <Tag style="font-family:fam; font-size: Size; color: Farbe;"> Tag { font-family:fam; font-size: Size; color: Farbe; Schriftart (font-family) Fam ist eine durch Kommata getrennte Liste von Namen, die entsprechend der Reihenfolge priorisiert sind. Sind im Namen Sonderzeichen enthalten, muss dieser in Hochkommata eingeschlossen sein, z. B. "Times New Roman". Schriftgröße (font-size) ist die Größenangabe 7
8 Schriften II Schriftfamilien (Beispiele) serif sans-serif monospace Schriften mit Anstrichen ("Häkchen") Schriften ohne Anstriche Alle Zeichen haben dieselbe feste Breite Schlüsselwörter für Schriftgrößen xx-small Sehr sehr klein large Groß x-small Sehr klein larger Etwas größer small Klein x-large Sehr groß smaller Etwas kleiner xx-large Sehr sehr groß medium Mittel 8
9 Schriften III - Umgebungsbezogene Farben Es werden die Farben der Umgebung übernommen (Auszug): activeborder activecaption appworkspace background buttonface buttonhighlight buttontext captiontext inactiveborder Aktive Fenstertitelzeile Überschrift der aktiven Fenstertitelzeile Hintergrund des aktiven Fensters Desktop-Hintergrund Buttons in Dialogfenstern 3D-Schatten der Buttons in Dialogfenstern Buttontext Überschriften im Dialogfenster Fenstertitelzeile inaktiver Fenster Es ist auch möglich, die Umgebungsschriften zu übernehmen. 9
10 Schriften IV <Tag style="font-weight: Stärke; font-style: Stil; font-variant: Var;"> Tag { font-weight: Stärke; font-style: Stil; font-variant: Var; Schriftdicke (font-weight) wird mit Schlüsselwörtern (bold, bolder, medium, lighter, normal) oder durch Angabe einer Zahl zwischen 100 (sehr dünn) und 900 (sehr dick) definiert - normal ist 500. Der Schriftstil (font-style) wird durch Schlüsselwörter definiert. italic, oblique, normal. Variationen der Schrift erfolgen durch Angabe von normal oder smallcaps (Kapitälchenschrift). 10
11 Beispiel <style type="text/css"> #p1 {font-weight: bold; font-style: italic; font-variant: small-caps; </style> <body> <p id="p1"> das ist etwas kurios <p> und hier gehts weiter </body> 11
12 Schriften V <Tag style="word-spacing: Wabstand; letter-spacing: Labstand;"> Tag { word-spacing: Wabstand; letter-spacing: Labstand; Festlegung des Abstandes zwischen Wörtern (word-spacing) oder Zeichen innerhalb eines Wortes (letter-spacing). Beispiel: <Tag style="word-spacing:4mm; letter-spacing:2mm;"> 12
13 Schriften VI <Tag style="text-decoration: Art;"> Tag { text-decoration: Art; Das Attribut text-decoration gibt weitere Veränderungen der benutzten Schrift an. Art kann sein: underline (Unterstreichen) overline (Unterstreichung oben) line-through (Durchstreichen) Blink (Browser-spezifisch) none (keine weiteren Attribute) Siehe: 13
14 Textausrichtung I <Tag style="text-indent: Val; line-height: Höhe; text-align: Aus;"> Tag { text-indent: Val; line-height: Höhe; text-align: Aus; Das nach rechts Einrücken der 1. Zeile erfolgt mit text-indent, wobei auch negative Werte angegeben werden können. Dann wird nach links eingerückt. Die Zeilenhöhe wird mit line-height bestimmt, übliche Einheiten sind em, px und mm. Die Ausrichtung selbst wird durch text-align definiert: right, left, center und justify. 14
15 Textausrichtung II Tag:first-line { Definitionen; Tag:first-letter { Definitionen; Die Pseudoklasse :first-line selektiert die gesamte erste Zeile. Die Pseudoklasse :first-letter selektiert das erste Zeichen, das z. B. größer gestaltet werden kann. 15
16 Textausrichtung III - Beispiel <!DOCTYPE html PUBLIC > <html......> <head> <title>...</title > <style type="text/css"> p:first-line {text-indent: 3mm; p.kapitel {font-size: 12pt; p.kapitel:first-letter {font-size: 40pt; float: left; </style> </head> <body> <p>das ist der Inhalt</p> <p class="kapitel"> Lorem ipsum sit amet.</p> <p>das war der Inhalt</p> </body> </html> 16
17 Textausrichtung IV - Beispiel Der Text im Absatz mit class=... fließt um den ersten groß dargestellten Buchstaben herum. Dies gilt nicht für den folgenden Absatz. float: left bedeutet, dass der Text um das Objekt, was links ist, rechts herum fließt. 17
18 Trennung in Texten Verwendung des optionalen Trennzeichens (Soft Hyphen): oder Beispiel Das Dampfschiffkapitänleutnantpatent ist schwer zu erlangen. Das Dampf schiff kapitän leutnant patent ist schwer zu erlangen. 18
19 Hoch- und Tiefgestellter Text CSS-Definitionen: sup { vertical-align : baseline; position : relative; top : -0.3em; sub { vertical-align : baseline; position : relative; top : 0.4em; p { line-spacing : 1.5em; Text: <p>lorem ipsum dolor sit amet, consetetur sadipscing elitr x<sup>2</sup>=4 sed diam nonumy eirmod tempor H<sub>2</sub>O invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p> 19
20 Hintergrund I <Tag style="background-color: Farbe; background-image: url(url); background-attachment: Art;"> Tag { background-color: Farbe; background-image: url(url); background-attachment: Art; Farbe und Hintergrundbild werden wie üblich angegeben. Das Attribut background-attachment erzeugt einen Wasserzeicheneffekt, wenn Art fixed ist; dann ist das Hintergrundbild beim Scrollen fest verankert, d.h. der Text scrollt über das feste Bild. 20
21 Hintergrund II <Tag style="background-repeat: Art; background-position: Position"> Tag { background-repeat: Art; background-position: Position; background-repeat legt das Wiederholungsverhalten fest; Art: repeat (Wiederholungen), repeat-x (1 Zeile lange Wieder-holungen), repeat-y (1 Spalte lange Wiederholungen), no-repeat background-position gibt die Position des Hintergrundbildes an Schlüsselwörter: top, center, middle, bottom, left, right; oder absolute Koordinaten der linken oberen Ecke des Bildes (x und y). Es sind auch %-Werte zulässig. Siehe: 21
22 Box-Modell I width margin-top border-top padding-top height margin-left border-left padding-left Inhalt padding-right border-right margin-right padding-bottom border-bottom margin-bottom 22
23 Box-Modell II Hinzu kommen noch Attribute für Farben Hintergründe Die meisten der angegebenen Attribute können für Elemente mit dem Charakter eines Rechtecks benutzt werden, insbesondere: zur Definition der Eigenschaften des Browserfensters, für Tabellenzellen bzw. Tabellen selbst und für frei positionierbare rechteckförmige Bereiche (div, Layer). 23
24 Attribute von Bildern <img style="height: Höhe; width: Breite; " > img { height: Höhe; width: Breite; weitere Attribute Bei Bildern sollten immer die Höhe und die Breite angegeben werden. So wie oben dargestellt, hätten dann alle Bilder dieselbe Größe; daher sollte mit IDs jeweils Bild für Bild gearbeitet werden: #picture { height: 20px; width: 20px;... <img id="picture" src="images/picture.gif"> 24
25 Rahmen I <Tag style="border-left-width: Val; border-right-width: Val; border-top-width: Val; border-bottom-width: Val; border-width: Val; "> Tag { border-left-width: Val; border-right-width: Val; border-top-width: Val; border-bottom-width: Val; border-width: Val; Bei der Angabe der Rahmenbreite (border-width) sind Zahlenangaben oder Schlüsselwörter möglich: thin, medium, thick 25
26 Rahmen II <Tag style="border-style: Art; border-color: Farbe; "> Tag { border-style: Art; border-color: Farbe; Die Art des Rahmens wird durch Schlüsselwörter festgelegt. Die Farbe des Rahmens wie sonst auch üblich Siehe: 26
27 Beispiel für Rahmenarten I <!DOCTYPE html PUBLIC > <html > <head><title>...</title > <style type="text/css">.bc1 { position: absolute; top: 8px; left: 4px; width: 120px; height: 120px; border-width: 8px; border-style: groove; border-color: olive;.bc2 { position: absolute; top: 8px; left: 145px; width: 120px; height: 120px; border-width: 8px; border-style: inset; border-color: olive;.bc3 { position: absolute; top: 8px; left: 285px; width: 120px; height: 120px; border-width: 8px; border-style: outset; border-color: olive;.bc4 { position: absolute; top: 8px; left: 425px; width: 120px; height: 120px; border-width: 8px; border-style: ridge; border-color: olive; </style> </head> <body> <div class="bc1"> border-style: <br/> groove</div> <div class="bc2"> border-style: <br/> inset </div> <div class="bc3"> border-style: <br/> outset</div> <div class="bc4"> border-style: <br/> ridge </div> </body> </html> 27
28 Beispiel für Rahmenarten II dashed dotted double groove inset none outset ridge gestrichelt gepunktet doppelt durchgezogen 3D-Effekt wie ein Graben 3D-Effekt (versenkt) unsichtbarer Rahmen 3D-Effekt (herausragend) 3D-Effekt wie ein Hügel Dies läuft sogar auf dem IE 8.0, allerdings sind die Farben nicht so schön. 28
29 Beispiel - CSS-Knöpfe für arme Leute I <!DOCTYPE html PUBLIC......> <html......> <head> <title>...</title > <style type="text/css">.button {font-weight: bold; text-decoration: none; border-color: Color1; background-color: Color2; padding: 5px; border-width: 4px; border-style: outset; a.button:active { border-color: Color1; background-color: Color1; border-width: 4px; border-style: inset; </style> </head> <body> <p>das ist der Inhalt</p> <p><a class="button" href=" google </a> </p> </body> </html> 29
30 Beispiel - CSS-Knöpfe für arme Leute II Mit ".button" wird eine Klasse definiert, die ein Rechteck festlegt. Mit "a.button" wird diese Klasse auf das A-Tag angewendet. Da das A-Tag verschiedene Zustände annehmen kann, können auch die Pseudo-Klassen ":link", ":visited" etc. angewendet werden. 30
31 Rahmen III <Tag style="padding-left: Val; padding-right : Val; padding-top: Val; padding-bottom : Val; padding: Val;"> Tag { padding-left: Val; padding-right: Val; padding-top: Val; padding-bottom: Val; padding: Val; Festlegung der Innenabstände zum Rahmen (Siehe Box-Modell) Siehe: 31
32 Rahmen IV <Tag style="margin-left: Value; margin-right: Value; margin-top: Value; margin-bottom: Value;" > Tag { margin-left: Value; margin-right: Value; margin-top: Value; margin-bottom: Value; margin: Value; Der Abstand des Elements zum Umfeld wird mit vier Margin-Angaben festgelegt (siehe Box-Modell). Es sind auch negative Werte möglich, was zu Überlappungen führen kann. Siehe: 32
33 Tabellen I - Beschriftung <caption style="caption-side=value;">... </caption> Für Value gibt es folgende Möglichkeiten: top topleft topright bottom bottomleft bottomright Zentriert über der Tabelle Linksbündig über der Tabelle Rechtsbündig über der Tabelle Zentriert unter der Tabelle Linksbündig unter der Tabelle Rechtsbündig unter der Tabelle 33
34 Tabellen II... <style type="text/css"> td { colspan: Value;... </style> <table...>... <td style="rowspan: Value;">... </table> Die Zusammenfassung mehrerer Spalten erfolgt mit colspan, mehrerer Zeilen mit rowspan - jeweils gefolgt mit einer Angabe der Anzahl der benachbarten Spalten bzw. Zeilen. Bei colspan werden die Spalten ab dem betreffenden Element nach rechts zusammengefasst. Bei rowspan werden die Zeilen ab dem betreffenden Element nach unten zusammengefasst. Die oben angegebene linke Form ist zu allgemein, auch hier sollte mit Ids gearbeitet werden. 34
35 Listen I... <style type="text/css"> ul { list-style-type: Art; ol { list-style-type: Art;... </style>... <ol style="list-style-position:pos;"> <li>... </li> <li>... </li>... </ol> Für ungeordnete Listen gibt es für Art folgende Möglichkeiten: disc (Punkt), circle (Kreis), square (Rechteck), none Für nummerierte Listen: decimal, lower-roman, upper-roman, lower-alpha, upper-alpha, none Durch list-style-position wird die Einrückung der Elemente bestimmt: inside (Listenzeichen wird in Block integriert), outside (Listenzeichen wird links herausgerückt) 35
36 Listen II <style type="text/css"> li { list-style-image: url(url);... </style> <Tag style="list-style: ListeVonDefinitionenMitBlanks;"> Tag { list-style: ListeVonDefinitionenMitBlanks; Durch Angabe einer URL von einer Datei wird die dort abgelegte Graphik als Listenzeichen benutzt. Mit list-style lassen sich mehrere Definitionen erstellen. Siehe: 36
37 Beispiele I <!DOCTYPE html PUBLIC > <html......> <head><title>...</title > <style type="text/css"> ul { list-style-type: circle; ol { list-style-type: upper-roman; </style> </head> <body> <ul> <li> Etwas1 </li> <li> Etwas2 </li> </ul> <ol> <li> Noch Etwas1 </li> <li> Noch Etwas2 </li> <li> Noch Etwas3 </li> <li> Noch Etwas4 </li> </ol> </body> </html> 37
38 Beispiele II <!DOCTYPE html PUBLIC > <html......> <head><title>...</title > <style type="text/css"> ul { list-style-type: square; list-style-position: inside; ol { list-style-type: upper-alpha; list-style-position: outside; </style> </head> <body> <ul> <li> Lorem ipsum dolor diam nonumy eirmod</li> <li> Lorem ametinvidunt diam voluptua. </li> </ul> <ol> <li> Lorem ipsum dolor sed diam nonumy eirmod</li> <li> Lorem ametinvidunt erat, sed diam voluptua. </li> <li> Noch Etwas3 </li> <li> Noch Etwas4 </li> </ol> </body> </html> 38
39 Beispiele III 39
40 Float I <div style="width: Val; height: Val; float: Art;">... Text... </div> Durch float wird der Text nicht in das Element gebracht, sondern in Abhängigkeit von Art um das Element: left: Element steht links vom Text right: Element steht rechts vom Text none: Element wird nicht vom Text umflossen Es sind nicht alle sinnvollen Kombinationen von Attributen korrekt realisiert! 40
41 Float II - Beispiel <!DOCTYPE html PUBLIC > <html > <head> <title>...</title > <style type="text/css" media="screen"> img.integriert { float: left; </style> </head> <body> <p>das ist der Inhalt Lorem ipsum dolor sit amet, aliquyam erat, <img class="integriert" src=" sed diam voluptua.. Stet clita amet.</p><p>das war der Inhalt</p> </body> </html> 41
42 Geschachtelte div I Layer-Definitionen: <div class="relative">... <div class="absolute">...</div> </div> relative absolute CSS-Definitionen:.relative { position: relative; width:...; height:...;.absolute { position: absolute; top: 50px; right: 50px; width: 200px; height: 100px;... Das innere Rechteck wird absolut relativ zum umfassenden äußeren Rechteck positioniert. 42
43 Geschachtelte div II position : relative bedeutet, dass das Rechteck relativ zur Stelle, an der es von vornherein gekommen wäre, um die Werte top und left verschoben wird position : absolute bedeutet, dass das Rechteck relativ zum nächst umfassenden Rechteck unabhängig von der Stelle, an der es von vornherein gekommen wäre, entsprechend positioniert wird. Gibt es kein umfassendes Rechteck, so wird das Bildschirm- Rechteck benutzt. position : fixed bedeutet, dass das Rechteck wie bei relative positioniert wird, aber beim Scrollen mitbewegt wird es bleibt also immer sichtbar stehen. 43
44 Div mit Scrollbalken Layer-Definition: <div id="content"> </div> CSS-Definition: #content { width:...; height:...; overflow-y: auto; overflow-x: auto; 44
45 Links <style type="text/css" media="screen"> a:link { Definitionen a:visited { Definitionen a:hover { Definitionen a:active { Definitionen </style> Die entsprechenden Definitionen gelten, wenn der Link nicht besucht wurde: link bereits besucht wurde: visited die Seite gerade geladen wird: active die Maus auf dem Link steht: hover :active muss als letztes definiert werden, damit dessen Definitionen entsprechend den Regeln der Kaskadierung nicht durch ein späteres :link etc. aufgehoben werden. 45
46 Formulare Eingabefelder hervorheben CSS-Definition: input:focus { background-color: yellow; Hat das Input-Feld den Fokus, wird der Hintergrund gelb gefärbt. CSS-Definition: input:focus:hover { background-color: green; Hat das Input-Feld den Fokus und ist die Maus darüber, wird der Hintergrund grün gefärbt. 46
![Formulare Pflichtfelder hervorheben CSS-Definition: input[type="text"][required] { border: 2px solid red; Es wird ein neues Attribut erfunden: required, das der Kennzeichnung dient, dies ist nicht](/docs-images/92/107891239/images/47-0.jpg "xhtml-strict. CSS-Definition: input[type=\"text\"]:required { border: 2px solid red; Dies geht nur in HTML5.")
47 Formulare Pflichtfelder hervorheben CSS-Definition: input[type="text"][required] { border: 2px solid red; Es wird ein neues Attribut erfunden: required, das der Kennzeichnung dient, dies ist nicht xhtml-strict. CSS-Definition: input[type="text"]:required { border: 2px solid red; Dies geht nur in HTML5. xhtml <p>eingabe: <input type="text"/></p> <p>eingabe: <input type="text" required="required"/></p> 47
48 Weiteres Es wurde nur ein Auszug aus CSS1/CSS2/CSS3 vorgestellt. Es fehlen: Viele Tabellenanwendungen Die Möglichkeiten zum Satzlayout, z.b. Seitenkopf, Fuß etc. Audio-Ausgabe, insbesondere die Sprachausgabe Präsentation von Zeichensätzen in einer anderen Leserichtung als im lateinischen Sprachraum üblich 48
49 Nach dieser Anstrengung etwas Entspannung... 49
Überblick. Farben Text Box-Modell Rahmen Hintergrund Tabellen Layer mit div Verschiedene Effekte. Webtechnologien WS 2017/18 - Teil 5/CSS II
Überblick Farben Text Box-Modell Rahmen Hintergrund Tabellen Layer mit div Verschiedene Effekte 2 Farben I Farben werden nach dem Rot-Grün-Blau (RGB)-Modell als hexadezimale Zahlen angegeben oder als vordefinierte
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...
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...
Überblick. Farben Text Box-Modell Rahmen Hintergrund Tabellen Layer mit div Verschiedene Effekte. Webtechnologien WS 2016/17 - Teil 8/CSS II
Überblick Farben Text Box-Modell Rahmen Hintergrund Tabellen Layer mit div Verschiedene Effekte 2 Farben I Farben werden nach dem Rot-Grün-Blau (RGB)-Modell als hexadezimale Zahlen angegeben oder als vordefinierte
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
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
CSS Befehle. Geschrieben von: Administrator Sonntag, den 24. April 2011 um 15:30 Uhr -
// = 3) version = "n3"; if (browsername == "Netscape" && browserver >= 4) version = "n4"; if (browsername == "Microsoft Internet Explorer" && browserver >= 3.01 && browsermac!= -1) version = "ie3m"; if
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
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 ,
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
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
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
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
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
Übung zur Vorlesung Digitale Medien. Sarah Tausch Alice Thudt Ludwig-Maximilians-Universität München Wintersemester 2012/2013
Übung zur Vorlesung Digitale Medien Sarah Tausch Alice Thudt Ludwig-Maximilians-Universität München Wintersemester 2012/2013 1 Pfadangaben (1) Pfadangaben sind relevant für Bilder, Verweise, Medienobjekte
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
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
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
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
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
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
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-,
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:
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
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
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
2. Briefing zur Übung IT-Systeme
2. Briefing zur Übung IT-Systeme - Einführung in HTML, CSS und JavaScript Fragestunde, 06.11.2017, PC Pool Stand und Ausblick Einführung: 17.10.2017, 12.00 Uhr (c.t.), HS 4 Fragestunde: 06.11.2017, 10.15
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,
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,
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
HTML-STANDARDS ZUR OPTIMALEN VERWENDUNG IN WCMS VOM HTML-DUMMY ZUR CONTENT-KLASSE
HTML-STANDARDS ZUR OPTIMALEN VERWENDUNG IN WCMS VOM HTML-DUMMY ZUR CONTENT-KLASSE HTML-DUMMY MUSS ICH VON NULL STARTEN? MUSS ICH VON NULL STARTEN? FRAMEWORKS Foundation 5 bzw. NEU 6 Basis CSS für Elemente
XSL-FO XSL Formatting Objects
XML-Praxis XSL-FO XSL Formatting Objects Jörn Clausen joern@techfak.uni-bielefeld.de Übersicht Funktionsweise von XSL-FO Seitendefinitionen Areas block- und inline-elemente Fonts XSLT und XSL-FO XML-Praxis
Ü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:
XHTML und CSS. Marco Skulschus Daniel Winter Alexander Muß
XHTML und CSS Marco Skulschus Daniel Winter Alexander Muß 1 2 XHTML und CSS Marco Skulschus Daniel Winter Alexander Muß Webseite zum Buch: www.comelio-medien.com/dedi3_568.php 2008 Comelio Medien 3 Alle
CSS - Cascading Style Sheets
CSS - Cascading Style Sheets HTML ist die Struktur, CSS ist das Design Eigenschaften von CSS: Definitionssprache zur Festlegung von Formateigenschaften von HTML-Elementen und/oder ganzer Seiten für unterschiedliche
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
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:
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
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,
[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
Die Funktionalität von Suchportalen
Studiengang Sprache und Kommunikation 1/6 Die Funktionalität von Suchportalen Anweisungen zur Erstellung eines eigenen Suchportals Ziel dieser Übung ist es, ein eigenes kleines Suchportal zu einem spezifischen
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
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
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:
Introduction to Technologies. Stylesheets mit CSS
Introduction to Technologies Stylesheets mit CSS Beispiele CSS http://css.maxdesign.com.au/listamatic/ http://www.csszengarden.com/tr/deutsch/ http://www.albinoblacksheep.com/livedesign http://de.selfhtml.org/css/layouts/index.htm
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
Beschreibung Tags Schlüsselwort. Schriftart. Die Liste ist keineswegs erschöpfend. <p><h1...6 > <li><td> <body> 'Arial','Helvetica','Tahoma','Verdana'
Die Liste ist keineswegs erschöpfend. Beschreibung Tags Schlüsselwort Werte Schriftart font-family: 'Arial','Helvetica','Tahoma','Verdana' serif = eine Schriftart mit Serifen,
Titel 1. Zeile (32pt) Titel 2. Zeile (32pt) Untertitel 1. Zeile (28pt) Untertitel 2. Zeile (28pt)
Titel 1. Zeile (32pt) Titel 2. Zeile (32pt) Untertitel 1. Zeile (28pt) Untertitel 2. Zeile (28pt) Vorname Name oder Abteilung Ort, 01.01.2010 Titel 1. Zeile (32pt) Titel 2. Zeile (32pt) Untertitel 1. Zeile
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........................
Ü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:
Einführung in das wissenschaftliche Arbeiten
in das wissenschaftliche Arbeiten L A TEX Beamer Vorlage Dr. Pia Heins Westfälische Wilhelms-Universität Münster 14. April 2015 Übersicht 1 in das Thema des Themas Gestaltung von Seiten durch 2 Spalten
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,
CSS. Webseiten- Layout mit. Know-how ist blau. Der perfekte Einstieg in Cascading Style Sheets
Clemens Gull Know-how ist blau. Berücksichtigt CSS 3 Webseiten- CSS Layout mit > CSS anhand von 23 Beispielen verstehen und praktisch einsetzen > Anspruchsvolle und flexible Weblayouts planen und realisieren
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
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 Grundgerüst. html> head> <title> Einführung </title> </head. body> <h1> Willkommen </h1> <p> Es war einmal </p> </body.
HTML - Kurs HTML Grundgerüst Einführung Willkommen Es war einmal Textformatierung Überschriften größ
4. Blöcke und Gebiete
4. Blöcke und Gebiete Inhalt 1. Einführung 2. Architektur 3. Vorlagen 4. Blöcke 5. Tabellen 6. Listen 7. Textformatierung 8. Grafik und Farbe 9. Buch-Erstellung Grundlagen Verfeinerung, Formatierung Formatierung
Ergänzungen zum HTML - Grundkurs
Ergänzungen zum HTML - Grundkurs Ein HTML - Dokument besteht grundsätzlich aus zwei Teilen; HEADER (Kopf, enthält allg. Angaben zu Titel und ähnlich) BODY (Körper, enthält den eigentlichen Text mit Überschriften,
WISE GRUNDLAGEN DES STÄDTEBAU DAS PRINZIP STADT. dokumentation
M8 GS WISE 2012 13 dokumentation INHALT DOKUMENTATION Deckblatt [Titel; Name des Verfassers der Verfasserin; WiSe 2012 13] Inhaltsverzeichnis [optional] M8 GS WiSe 2012 13 betreut durch Prof. Dipl. Ing.
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
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
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
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
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
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
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
Installationsbeschreibung des Homepagekalenders
Installationsbeschreibung des Homepagekalenders Bitte beachten Sie: Um den Homepagekalender (im Folgenden HPK) als kostenlosen Service installieren zu können, müssen Sie registrierter Anbieter im Umweltkalenders
CSS - Cascading Style Sheets (Level 3) Grundlagen. Marc Haunschild. 2. Ausgabe, Oktober 2014 CSS3
Marc Haunschild 2. Ausgabe, Oktober 2014 CSS - Cascading Style Sheets (Level 3) Grundlagen CSS3 5 CSS - Cascading Style Sheets (Level 3) - Grundlagen 5 Texte gestalten In diesem Kapitel erfahren Sie wie
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
Praktikum im Grundstudium
Praktikum im Grundstudium Teil 2: Layout mit CSS Zweck von Stylesheets Ergänzung zu XHTML XHTML legt Struktur des Dokuments fest Definiert Formateigenschaften Trennung von Inhalt und Layout Stylesheet
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
HTML-Grundlagen. Die Layout- und Formatierungsanweisungen heißen Tags, z.b.
HTML-Grundlagen HTML (Hypertext Markup Language) -Dokumente sind einfache Textdateien, die neben dem eigentlichen Text zusätzliche Anweisungen enthalten, wie das Dokument von einem Browser auf dem Bildschirm
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
Unterschied zwischen HTML & XHTML?
Tutorium Webdesign von Maria Lechner Unterschied zwischen HTML & XHTML? HTML HyperText Markup Language (Hypertext-Auszeichnungssprache) SGML-basierte HTML XHTML Extensible HyperText Markup Language (erweiterbare
Grundlagen der WWW-Nutzung und WWW-Programmierung. Alfred Wassermann
Grundlagen der WWW-Nutzung und WWW-Programmierung Alfred Wassermann Inhaltsverzeichnis 12 Vorlesung 2 12.1 Weitere Style-Sheet-Befehle..................... 2 12.1.1 Einzelne Tags verändern...................
Kapitel 10: Cascading Style Sheets
10. Einführung in CSS Cascading Style Sheets 10-1 Kapitel 10: Cascading Style Sheets Literatur: Erik Wilde: World Wide Web Technische Grundlagen. Springer, 1999, ISBN 3-540-64700-7, 641 Seiten. Eric Ladd,
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...
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
index.html schwerpunkt HTML und Informationssysteme 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,
Aufbau einer HTML Seite:
1 Aufbau einer HTML Seite: Grundstruktur: Head Bereich: "nicht sichtbar" Er enthält grundlegende Informationen wie: Title, Charset, Ansichtsgröße,
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
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
Corporate Design Manual. Stand
Corporate Design Manual Stand 30.05.2017 Vorwort Ein Corporate Design Manual ist wie das Regelwerk eines Spiels. Es legt die Spielregeln fest, definiert die Größe des Spielfelds, zeigt die Spielregeln
XSLT 2015/2016 S Seite 1 h_da W
XSLT Seite 1 XSL / XSLT xsltransformation ::= stylesheet stylesheet ::= template* template pattern ::= pattern, content_constructor ::= patternpath Content_constructor ::= literal_result_element instruction
Ü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,
<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
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 $ %!&'(
Digitale Medien Vergangene Vorlesungen. Style-/Formatangaben. Style Angabe für jedes HTML-Element einfachster Fall: style-attribut
Vergangene Vorlesungen Digitale Medien HTML Grundlagen Wichtige HTML Elemente 4. STYLESHEETS, CSS Heute: Anwendung Beispiele Trennung von Inhalt und Layout Oder: Woher weiß der Browser wie eine Seite darzustellen
7 Tabellen. 7.1 Erstellen einer Tabelle. - übersichtliches Gestalten von Websites - enorme Steigerung der Layoutmöglichkeiten durch Tabellen
1 7 Tabellen - übersichtliches Gestalten von Websites - enorme Steigerung der Layoutmöglichkeiten durch Tabellen 7.1 Erstellen einer Tabelle Syntax: Inhalt1 Inhalt2 Kommentar
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,
PDML. Grundsätzliches zu den Größeneinheiten. Die Befehle. author. Partnerseller 3.1.2
PDML PDML ist die Abkürzung für "Portable Document Markup Language" - eine in PHP geschriebene Auszeichnungssprache zur Erstellung von PDF-Dokumenten. PDML wird in Partnerseller in den Templates für die
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
Hurenkinder Zwiebelfische Augenpulver
LUG Erding Hurenkinder Zwiebelfische Augenpulver Einführung in die Typographie und das Desktop-Publishing mit Scribus Jan Schulze 25. März 2009 Agenda Grundlagen Typographie inkl. Fachchinesisch Warum
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
Augsburger Off-Topic-Seminar Einführung in die Typographie 1 / 18
Augsburger Off-Topic-Seminar Einführung in die Typographie 1 / 18 Gliederung 1 Todsünden 2 Praktische Tipps 3 Endgegner Augsburger Off-Topic-Seminar Einführung in die Typographie 2 / 18 Augsburger Off-Topic-Seminar
Sass. Syntactically Awesome Stylesheets. Christian Kaula christiankaula.com
Sass Syntactically Awesome Stylesheets Christian Kaula christiankaula.com Sass? Sass? Metasprache auf Basis von CSS Sass? Metasprache auf Basis von CSS vereinfacht CSS durch Entfernung redundanter Elemente
JavaScript II. Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 SS2014 Prof. Dipl.-Ing. Martin Schober
JavaScript II Bildaustausch mit dem Attribut name und zwei Funktionen function asterix() { document.images1.src="bilder/asterix.jpg"; function obelix() { document.images1.src="bilder/obelix.jpg";