Der Unterschied zwischen HTML-Frame, Iframe und Frameset _HTML/Xhtml_Webseitenproduktion

10.4.1  Frameset与Frame的区别
首先讲解Frameset与Frame之间的区别。

用来划分框架，每一个框架由标记。必须在之内使用，代码如下：

在上面的例子当中，把页面分为左右两个部分，左侧框架中的页面是admin_left.htm，右侧框架中的页面是admin_center.htm。

注意：标记的框架顺序为从左至右或从上到下。

两者的差别如下：

  ● 为框架标记，说明该网页文档为框架组成，并设定文档中组成框架集的框架的布局。

  ● 用以设置组成框架集中各个框架的属性。

10.4.2  Frameset参数设置
需要设置一些特定的参数，这些参数直接决定了整个页面的布局，代码如下：

关于上段代码的各项参数设置及其含义如表10.3所示。

表10.3  Frameset参数

参    数	说    明
Border	设定框架的边框厚度，以pixels为单位
frameborder	设定是否显示框架的边框，0为不显示，1为显示
FrameSpacing	表示框架与框架之间的距离
BorderColor	设定框架的边框颜色
Row	将文档分为上下的框架，Row后的值可以为数值或百分数，*表示占用余下的空间，数值的个数代表水平分成的框架个数，例如Rows=“210,*,10%”，表示页面分为上中下三个框架页，上边的框架占用210px，下边的框架占用整个文档的10%，余下的空间为中间的框架占用。*是一个相对的概念，例如Row=*，表示页面中没有上下结构的框架布局
Cols	设置同Row

10.4.3  Frame参数设置

关于Frame参数的设置，代码如下：

 

如表10.4所示。

表10.4  Frame参数

参    数	说    明
Name	设定框架的名称，须为英文
Src	设置框架中显示的页面路径和名称，可为相对路径亦可为绝对路径
Marginwidth	表示框架距离左右边缘的距离
Marginheight	表示框架距离上下边缘的距离
Scrollling	设置是否在框架中显示滚动条，yes为显示，no为不显示，auto表示当框架页中内容超过框架的大小时自动显示滚动条
Frameborder	设置是否显示框架的边框，0为不显示，1为显示
Noresize	Legen Sie fest, ob der Benutzer die Größe dieses Rahmens ändern kann. Wenn dies nicht festgelegt ist, kann der Betrachter den Rahmen ziehen und die Größe des Rahmens ändern
Frameabstand	Gibt den Abstand zwischen Frames an
Randfarbe	Legen Sie die Rahmenfarbe des Rahmens fest

10.4.4 Der Unterschied zwischen Frame und Iframe

Frame und Iframe können im Grunde die gleichen Funktionen erreichen, aber Iframe bietet mehr Flexibilität als Frame.

Iframe-Tag wird auch Floating-Frame-Tag genannt und kann zum Einbetten eines HTML-Dokuments in einen HTML-Code zur Anzeige verwendet werden. Der größte Unterschied zum Frame-Tag besteht darin, dass der in der Webseite eingebettete Inhalt ein integraler Bestandteil der gesamten Seite ist, während der in ist ein eigenständiges Einzelbild, das unabhängig voneinander angezeigt werden kann. Darüber hinaus kann durch die Verwendung von Iframe derselbe Inhalt auch mehrmals auf derselben Seite angezeigt werden, ohne dass der Code dieses Inhalts wiederholt werden muss.

Die in Abbildung 10.21 gezeigte Seite verwendet Iframe, um paginierte Links oben und unten auf der Seite zu erstellen. Sie müssen lediglich dieselbe Datei in die Webseite einbetten Das Schreiben des Codes muss nicht wiederholt werden. Informationen zu den tatsächlichen Auswirkungen des Falls finden Sie in der Datei case/frame/iframe/see_infomore_iframe.htm auf der beiliegenden CD.

10.4.5 Iframe-Transparenz einstellen

Ein noch größerer Vorteil von Iframe besteht darin, dass Sie den Rahmen transparent einstellen können, sodass der Hintergrund im Rahmen mit dem Hintergrund der Hauptseite übereinstimmt. In der obigen Beispieloperation werden aufmerksame Leser dieses Problem finden. Hier finden Sie eine detaillierte Erklärung zum Festlegen der Iframe-Transparenz. Die spezifischen Schritte sind wie folgt:

(1) Öffnen Sie case/frame/iframe/see_infomore_iframe1.htm auf der Buch-CD.

(2) Durchsuchen Sie die Auslagerungsdatei im Browser und stellen Sie fest, dass der Hintergrund der Originalzelle in dem Bereich verdeckt ist, in dem der Iframe eingefügt wird. Dies ist nicht der gewünschte Effekt.

(3) Öffnen Sie die Seite „page.htm“, wechseln Sie zur Codeansicht und fügen Sie den folgenden Code in das Tag ein

Abbildung 10.21 Verwenden von Iframe zum Erstellen von Seitenumblättern

(4) Wechseln Sie see_infomore_iframe1.htm zur Codeansicht und sehen Sie sich den Code der Zelle an, in der der Iframe auf der Seite eingefügt wird, wie folgt:

(5) Im

(7) Speichern Sie die beiden Seiten page.htm und see_infomore_iframe1.htm und durchsuchen Sie den Effekt im Browser.