Die Präsentation wird geladen. Bitte warten

Die Präsentation wird geladen. Bitte warten

9. Frames1 Was ist ein Frame? l Frames teilen Browser-Fenster in rechteckige Bereiche. l Mehrere Web-Seiten können l gleichzeitig angezeigt werden l unabhängig.

Ähnliche Präsentationen


Präsentation zum Thema: "9. Frames1 Was ist ein Frame? l Frames teilen Browser-Fenster in rechteckige Bereiche. l Mehrere Web-Seiten können l gleichzeitig angezeigt werden l unabhängig."—  Präsentation transkript:

1 9. Frames1 Was ist ein Frame? l Frames teilen Browser-Fenster in rechteckige Bereiche. l Mehrere Web-Seiten können l gleichzeitig angezeigt werden l unabhängig voneinander gesteuert werden l Web-Seite wird langsamer geladen

2 9. Frames2 Frame-Layout entwerfen l Beispiel: l Oberhalb der Titel der Web-Seite l Linke Seite = Navigationsleiste l Rechter Bereich = zum Anzeigen der Web-Seiten statisch: Inhalt bleibt gleich l Vorab grobes Layout der Web- Seite entwerfen:

3 9. Frames3 Frames definieren l Frame wird in separater Datei definiert mit Informationen zu: l Größe und Ausrichtung jedes Frames l Name der Web-Seite, die angezeigt werden soll Befehl Definition des Frames Befehl Definition des Frames

4 9. Frames4 Grundgerüst zur Frame-Definition Frameset enthält kein Frameset enthält kein Vor dem Frameset keine anderen HTML-Elemente wie,, Vor dem Frameset keine anderen HTML-Elemente wie,, Befehle des Dokumentkopfs ( ) dürfen vor eingefügt werden Befehle des Dokumentkopfs ( ) dürfen vor eingefügt werden Ein Frameset-Dokument Definition des Frames

5 9. Frames5 Browser-Fenster aufteilen l Ab Grundgerüst: Browser-Fenster einteilen in Spalten und/oder Zeilen Attribute cols="Aufteilung" und rows="Aufteilung" : Attribute cols="Aufteilung" und rows="Aufteilung" : Anzugeben innerhalb des Befehls l Zur Aufteilung des Browser-Fensters in Gruppen l Werte in Prozent, Pixel oder *:  müssen durch Kommata voneinander getrennt werden  Anzahl der angegebenen Werte bestimmt Anzahl der Spalten/Zeilen

6 9. Frames6 Beispiele zur Frames-Aufteilung HTML-Code: Definition des Frames HTML-Code: Definition des Frames HTML-Code: Definition des Frames Definition des Frames HTML-Code: Definition des Frames Definition des Frames

7 9. Frames7 Befehl l Teilt Fenster in Bereiche auf Attribut src="Dateiname" : Dateiname = HTML-Datei Attribut src="Dateiname" : Dateiname = HTML-Datei Attribut name="xyz" : Attribut name="xyz" : l Jedes Frame braucht einen Namen. Attribut darf aus Buchstaben, Ziffern und Unterstrichen bestehen (Ausnahme: _self, _parent, _blank, _top ). l Groß- und Kleinschreibung wird unterschieden.

8 9. Frames8 Beispiel zur Erstellung eines Framesets Anwenden von Frames l Vorab drei Dateien anlegen: flinks.html, foben.html, fhaupt.html

9 9. Frames9 Fertiges Frameset im Browser

10 9. Frames10 Angaben in Pixel * = Fülle die Fläche mit dem noch verfügbaren Platz. * = Fülle die Fläche mit dem noch verfügbaren Platz. Es ist vorteilhaft, * in Pixelangaben zu nutzen, ansonsten bleibt das Frame bei Größenänderung gleich groß. Es ist vorteilhaft, * in Pixelangaben zu nutzen, ansonsten bleibt das Frame bei Größenänderung gleich groß. Teilen einer Fläche: Das obere Frame ist doppelt so groß wie unterer:. Teilen einer Fläche: Das obere Frame ist doppelt so groß wie unterer:. l Überprüfen Sie, ob alle Informationen zu sehen sind.

11 9. Frames11 Angaben in Prozent l Prozentwerte zwischen 1 und 100 l Alle Frames innerhalb eines Framesets = 100% Beispiel: Beispiel: l Falls Werte größer 100: Bereiche werden automatisch herunterskaliert. l Gesamtsumme unter 100: l Bereiche werden automatisch heraufskaliert. l Falls relative Größe (*) vorhanden ist, wird Überschuss dem * zugeteilt.

12 9. Frames12 Browser ohne Frames l Einige Browser kennen Frames-Befehle nicht. Informationen für nicht framefähige Browser sind über den Befehl zu erhalten. Informationen für nicht framefähige Browser sind über den Befehl zu erhalten. Befehl : Befehl : Enthält den Dokumentenkörper l Muss vor dem letzten Frameset eingegeben werden l Wird von framefähigen Browsern ignoriert

13 9. Frames13 Einflussnahme auf die Bildlaufleisten l Festlegen, ob Bildlaufleisten sichtbar sind: Attribut scrolling=yes (immer sichtbar) Attribut scrolling=no (nie sichtbar) Attribut scrolling=auto (Browser-abhängig) Attribut scrolling=no nur bei sehr kleinen Frame- Inhalten (z.B. Logo oder Überschrift) Attribut scrolling=no nur bei sehr kleinen Frame- Inhalten (z.B. Logo oder Überschrift) Beispiel: Beispiel:

14 9. Frames14 Beispiel für Festlegung der Bildlaufleiste l Bildlaufleiste immer sichtbar l Nur Überschrift: Bildlaufleiste nie sichtbar l Viel Information im Haupt-Frame: Bildlaufleiste automatisch

15 9. Frames15 Frame-Größe festsetzen Das Attribut noresize unterbindet Größenänderung durch den Anwender. Das Attribut noresize unterbindet Größenänderung durch den Anwender. Das Attribut wird in die Frame-Definition eingefügt. Das Attribut wird in die Frame-Definition eingefügt. l Keine Wertangabe Beispiel: Beispiel: l Auch benachbarte Frames können nicht mehr verändert werden.

16 9. Frames16 Umrandung anlegen Attribut frameborder="Wert" : dreidimensionale Umrandung um Frame Attribut frameborder="Wert" : dreidimensionale Umrandung um Frame frameborder=0 (Umrandung ausgeschaltet) frameborder=1 (Umrandung eingeschaltet - Standard) l Attribut einfügen innerhalb des Framesets Beispiel: Beispiel:

17 9. Frames17 Frame-Abstand bestimmen Mit Attribut framespacing="Pixel" werden Frames nicht direkt aneinander dargestellt. Mit Attribut framespacing="Pixel" werden Frames nicht direkt aneinander dargestellt. l Das Attribut wird innerhalb des Framesets eingefügt. Beispiel: Beispiel:

18 9. Frames18 Umrandungsbreite festlegen Mit Attribut border="Pixel" wird Breite der Umrandung festgelegt. Mit Attribut border="Pixel" wird Breite der Umrandung festgelegt. l Das Attribut wird innerhalb des Framesets eingefügt. l Wert ab einem Pixel: zweidimensionale Darstellung l Der Wert 0 schaltet Umrandung ab. Beispiel: Beispiel:

19 9. Frames19 Umrandungsfarbe bestimmen Mit Attribut bordercolor="Farbe" wird Farbe der Umrandung festgelegt. Mit Attribut bordercolor="Farbe" wird Farbe der Umrandung festgelegt. l Das Attribut wird innerhalb des Framesets eingefügt. l Vordefinierte oder hexadezimale Farbangabe l Frame-Umrandung muss eingeschaltet sein. Beispiel: Beispiel:

20 9. Frames20 Abstand des Inhalts im Frame Attribute marginheight="Pixel" (Randhöhe) marginwidth="Pixel" (Randbreite) Attribute marginheight="Pixel" (Randhöhe) marginwidth="Pixel" (Randbreite) Attribut einfügen innerhalb des Tags Attribut einfügen innerhalb des Tags l Beispiele: l Frame mit Zwischenraum l Frame ohne Rand

21 9. Frames21 Tipps zum Frame eines Logos l Höhe des Frames auf Höhe des Logos l Bildlaufleiste abschalten l Frame-Größe festsetzen l Ränder des Frames auf 0 Pixel

22 9. Frames22 Namen eines Frames angeben

23 9. Frames23 Hyperlinks setzen Attribut target="Name" Attribut target="Name" l Gibt Verweisziel an, in dem der Hyperlink geöffnet werden soll Attribut angeben innerhalb... Beispiel: Befehl Befehl Anzugeben innerhalb des Kopfabschnitts l Alle Links innerhalb der Web-Seite werden in Frames mit entsprechenden Namen angezeigt Beispiel: Das Alphabet...

24 9. Frames24 Frames beenden l Dokument wird in neuem leeren Fenster geöffnet: l target="_blank l Dokument wird in dem Frame geöffnet, in dem der Verweis steht: l target="_self l Verweis wird in das übergeordnete Fenster geladen: l target="_parent l Gesamtes Frameset wird geschlossen, Dokument wird in gesamten Browser-Fenster angezeigt: l target="_top

25 9. Frames25 Erstes Beispiel aus dem Internet

26 9. Frames26 Zweites Beispiel aus dem Internet

27 9. Frames27 Drittes Beispiel aus dem Internet


Herunterladen ppt "9. Frames1 Was ist ein Frame? l Frames teilen Browser-Fenster in rechteckige Bereiche. l Mehrere Web-Seiten können l gleichzeitig angezeigt werden l unabhängig."

Ähnliche Präsentationen


Google-Anzeigen