📜  HTML-框架

📅  最后修改于: 2020-12-16 05:50:41             🧑  作者: Mango


HTML框架用于将浏览器窗口分为多个部分,其中每个部分都可以加载单独的HTML文档。浏览器窗口中的框架集合称为框架集。窗口以类似于表格组织方式的方式分为框架:分为行和列。

镜框的缺点

使用框架几乎没有弊端,因此永远不建议在网页中使用框架-

  • 一些较小的设备通常无法应付帧,因为它们的屏幕不够大,无法分割。

  • 有时,由于屏幕分辨率不同,您的页面在不同计算机上的显示也会有所不同。

  • 浏览器的后退按钮可能无法按用户希望的那样工作。

  • 仍然有少数浏览器不支持框架技术。

创建框架

要在页面上使用框架,我们使用标签而不是标签。 标记定义如何将窗口划分为框架。 标签的rows属性定义水平框架,而cols属性定义垂直框架。每个框架都由标记指示,它定义了应在该框架中打开哪个HTML文档。

注意-HTML5中已弃用标记。不要使用此元素。

以下是创建三个水平框架的示例-

HTML Frames
   
    
   
      
      
      
   
      
         Your browser does not support frames.
      
      
   
   

这将产生以下结果-

让我们将上面的示例如下所示,在这里我们将cols属性替换为cols并更改了宽度。这将垂直创建所有三个框架-

HTML Frames
   
   
   
      
      
      
      
      
         Your browser does not support frames.
      
   
   

这将产生以下结果-

标记属性

以下是标记的重要属性-

Sr.No Attribute & Description
1

cols

Specifies how many columns are contained in the frameset and the size of each column. You can specify the width of each column in one of the four ways −

Absolute values in pixels. For example, to create three vertical frames, use cols = “100, 500, 100”.

A percentage of the browser window. For example, to create three vertical frames, use cols = “10%, 80%, 10%”.

Using a wildcard symbol. For example, to create three vertical frames, use cols = “10%, *, 10%”. In this case wildcard takes remainder of the window.

As relative widths of the browser window. For example, to create three vertical frames, use cols = “3*, 2*, 1*”. This is an alternative to percentages. You can use relative widths of the browser window. Here the window is divided into sixths: the first column takes up half of the window, the second takes one third, and the third takes one sixth.

2

rows

This attribute works just like the cols attribute and takes the same values, but it is used to specify the rows in the frameset. For example, to create two horizontal frames, use rows = “10%, 90%”. You can specify the height of each row in the same way as explained above for columns.

3

border

This attribute specifies the width of the border of each frame in pixels. For example, border = “5”. A value of zero means no border.

4

frameborder

This attribute specifies whether a three-dimensional border should be displayed between frames. This attribute takes value either 1 (yes) or 0 (no). For example frameborder = “0” specifies no border.

5

framespacing

This attribute specifies the amount of space between frames in a frameset. This can take any integer value. For example framespacing = “10” means there should be 10 pixels spacing between each frames.

标记属性

以下是标签的重要属性-

Sr.No Attribute & Description
1

src

This attribute is used to give the file name that should be loaded in the frame. Its value can be any URL. For example, src = “/html/top_frame.htm” will load an HTML file available in html directory.

2

name

This attribute allows you to give a name to a frame. It is used to indicate which frame a document should be loaded into. This is especially important when you want to create links in one frame that load pages into an another frame, in which case the second frame needs a name to identify itself as the target of the link.

3

frameborder

This attribute specifies whether or not the borders of that frame are shown; it overrides the value given in the frameborder attribute on the tag if one is given, and this can take values either 1 (yes) or 0 (no).

4

marginwidth

This attribute allows you to specify the width of the space between the left and right of the frame’s borders and the frame’s content. The value is given in pixels. For example marginwidth = “10”.

5

marginheight

This attribute allows you to specify the height of the space between the top and bottom of the frame’s borders and its contents. The value is given in pixels. For example marginheight = “10”.

6

noresize

By default, you can resize any frame by clicking and dragging on the borders of a frame. The noresize attribute prevents a user from being able to resize the frame. For example noresize = “noresize”.

7

scrolling

This attribute controls the appearance of the scrollbars that appear on the frame. This takes values either “yes”, “no” or “auto”. For example scrolling = “no” means it should not have scroll bars.

8

longdesc

This attribute allows you to provide a link to another page containing a long description of the contents of the frame. For example longdesc = “framedescription.htm”

浏览器对框架的支持

如果用户使用的是任何旧的浏览器或不支持框架的任何浏览器,则应向用户显示元素。</p> <p>因此,您必须将<body>元素放置在<noframes>元素内,因为<frameset>元素应该替换<body>元素,但是如果浏览器不理解<frameset>元素,则它应该了解内部的内容。 <noframes>元素中包含的<body>元素。</p> <p>您可以向使用旧浏览器的用户发送一些好消息。例如,<i>对不起!你的浏览器不支持框架。</i>如上例所示。</p> <h2>框架的名称和目标属性</h2> <p>框架最流行的用途之一是将导航栏放置在一个框架中,然后将主页加载到单独的框架中。</p> <p>让我们看下面的示例,其中test.htm文件具有以下代码-</p> <div class="demo-view"><a class="demo" href="http://tpcg.io/DBmVdH" rel="nofollow noopener" target="_blank"><i class="fa-external-link"></i>现场演示</a></div> <div class="hcb_wrap"> <pre class="prism line-numbers lang-java" data-lang="java"><code class="language-markup"><title>HTML Target Frames</title> <frameset cols="200, *"> <frame src="/html/menu.htm" name="menu_page"> <frame src="/html/main.htm" name="main_page"> <noframes> Your browser does not support frames.

在这里,我们创建了两列以填充两个框架。第一帧为200像素宽,将包含由menu.htm文件实现的导航菜单栏。第二列将填充剩余空间,并将包含页面的主要部分,并由main.htm文件实现。对于菜单栏中的所有三个链接,我们将目标框架称为main_page ,因此,每当您单击菜单栏中的任何链接时,可用链接都会在主页中打开。

以下是menu.htm文件的内容

以下是main.htm文件的内容-

This is main page and content from any link will be displayed here.

So now click any link and see the result.

当我们加载test.htm文件时,它将产生以下结果-

现在,您可以尝试单击左侧面板中的可用链接,然后查看结果。 targetattribute也可以采用以下值之一-

Sr.No Option & Description
1

_self

Loads the page into the current frame.

2

_blank

Loads a page into a new browser window. Opening a new window.

3

_parent

Loads the page into the parent window, which in the case of a single frameset is the main browser window.

4

_top

Loads the page into the browser window, replacing any current frames.

5

targetframe

Loads the page into a named targetframe.