Frames + Framesets

Frames kann man verschachteln. Das bedeutet, man kann in einen Frame eines Framesets weitere Framesets einfügen! Ein Frameset steht dann innerhalb eines anderen Framesets
 Frames Intro - Grundlagen
    
 HomeFrames • Frames Intro 5 BEISPIEL  DOWNLOAD 

 Frames Intro 5 - verschachtelte Framesets

Frames kann man verschachteln. Das bedeutet, man kann in einen Frame eines Framesets weitere Framesets einfügen! Ein Frameset steht dann innerhalb eines anderen Framesets
Ein Frameset im Frameset, das geht auch

Öffnen Sie doch meine Demo in einem neuen Browserfenster: Demo-Frameset


   Das Ziel: Frameset mit 3 Frames

So soll die Browserfenster- / Seiteneinteilung später aussehen. Sie möchten den Bildschirm in 3 Bereiche aufteilen. Dieses Beispiel einer Frameset-Datei hat 2 verschachtelte Framesets.
  • Titelbereich + Hauptmenü
  • Menübereich Untermenü
  • Anzeigebereich


Bewegen Sie den Mauszeiger über
die Verweise für eine Demo

oberer Bereich für den Seitentitel

linker Bereich für die Navigation

rechter Bereich für die Inhalte

  schrittweiser Aufbau

Ich definiere einen ersten Frameset (Frameset 1) der zunächst einmal aus 2 Frames mit einer horizontalen Aufteilung von 120 Pixel und dem Rest des Anzeigebereichs bestehen soll.

<frameset rows=" 120, * ">
    <frame name="oben" ... > 
    <frame name="unten" ... >
</frameset>


Weil der untere Frame noch einmal in 2 Bereiche aufgeteilt werden soll, wird der Frame mit dem Namen 'unten' durch einen weiteren Frameset ersetzt. Der Frameset 2 wird in den Set 1 an Stelle des Frames "unten" eingesetzt.

Der Frameset 2 soll den Frame 'unten' ersetzen.
Frameset 1 rows="120, * "



Frameset 2 cols="180, * "


 
<frameset rows=" 120, * ">
    <frame name="oben" ... > 
    <frame name="unten" ... > 



    </frameset>

</frameset>




<frameset cols="180, * " >
     <frame ... >
     <frame ... >
</frameset>
Im Code für Frameset 1 (oben links) fällt die Zeile für den Frame "unten" weg und wird ersetzt mit dem Code für Frameset 2 (den Sie oben rechts sehen).
Ergebnis

<frameset rows=" 120, * ">
    <frame name="oben" ... > 
    <frameset cols="180, * " >
         <frame ... >
         <frame ... >
    </frameset>

</frameset>



  Die Verschachtelung


Der Frameset 1 (violett) besteht aus 2 Bereichen. Er hat als Inhalt nicht zwei Frames sondern einen Frame und einen Frameset. Der Frameset 2 (rot) hat als Inhalt zwei Frames.


<frameset rows=" 120,*">
 <frame src="titel.htm" name="oben">
 <frameset cols="180,*">
  <frame src="menue.htm" name="nav">
  <frame src="start.htm" name="anzeige">
 </frameset>
</frameset>

Nun hat unser Frameset insgesamt 3 Frames.





1) den oberen Frame mit dem Namen "oben" (Höhe 120 Punkte rows=120).
2) den linken Frame mit dem Namen "nav" (Breite 180 Punkte cols=180 )
3) den rechten Frame mit dem Namen "anzeige" (Rest der Bildschirmbreite *).




  Inhalte der Frames bestimmen

Gleich zu Beginn (beim Laden) wird die Datei

titel.htm in das obere Fenster,
menue.htm in das linke Fenster
start.htm in das rechte Fenster geladen.




 <frameset rows=" 120, * ">
   <frame src="titel.htm" name="oben"> 
   <frameset cols="180, * ">
      <frame src="menue.htm" name="nav">
      <frame src="start.htm" name="anzeige">
   </frameset>
 </frameset>

Um diese Frameset-Datei und ihre Inhalte anzuzeigen, werden nun insgesamt 4 Dateien benötigt. Eine Frameset-Datei und weitere 3 HTML-Dateien, welche die 3 Frames mit Inhalt füllen.

Um innerhalb von Framesets bei Verweisen eine Datei in einem bestimmten, der 3 Frames anzeigen zu lassen, wird im HTML-Tag des Links das Attribut 'target' eingetragen und der entsprechende Framename notiert.

mehr Info zum Attibut 'target' lesen




Fertige Homepage-Vorlagen mit Frames können Sie im Menü 'Downloads' ansehen und herunter laden.

Homepage-Vorlage F06 ansehen

Erklärungen zur Homepage-Vorlage F06 ansehen

Homepage-Vorlage F06 herunter laden

Menü Downloads für HP-Vorlagen mit Framesets anzeigen


Grundlagen:

Frames Intro 0 - Einsatzbereiche

Frames Intro 1 - simple Definition

Frames Intro 2 - Namen + Inhalte bestimmen

Frames Intro 3 - Ränder, Margins, Abstand

Frames Intro 4 - Scrollbars , Resize

Frames Intro 5 - verschachtelte Framesets

Frames Intro 6 - NoFrames-Bereich