Use layout pages (div + CSS layout and frameset layout, two parallel strategies)

Source: Internet
Author: User
From: http://blog.3gcomet.com/article.asp? Id = 43 Differences between frame, IFRAME, and frameset Author: comet Date: font size: Small Medium large

<Frameset> <frame>
<Noframes>
<IFRAME>
For details about the tag classification of [HTML Analysis] in this article, refer to [tag overview ].
Please refer to [HTML concept] For details about the block tag and empty tag ].

■ Framework concept:
The so-called framework is to divide a webpage into several frames and obtain multiple URLs at the same time. You only need to <frameset> <frame>, and all frame markers need to be placed in a total HTML file. This file only records how the framework is divided and does not display any information, therefore, you do not need to add the <body> flag. to browse this framework, you must read this file instead of the files in other frame windows. <Frameset> is used to divide a frame window. Each frame window is marked by a <frame> MARK. <frame> must be used in the <frameset> range. For example:
<Frameset Cols = "50%, *">
<Frame name = "hello" src = "up2u.html">
<Frame name = "hi" src = "me2.html">
</Frameset>
In this example, <frameset> splits the image into the left and right sides, displays up2u.html on the left, and displays the me2.html file on the right, <frame> the marked window is always in the order of top, bottom, left to right.

This section is mostly the same as the composer classroom's [Application Framework], but this section adds content and details. As in other chapters, we will not mention the webpage creation tool, if you have learned HTML, I believe you will not use composer or Frontpage tools.

■ <Frameset> <frame>:

Cols = "90, *"
vertical cut screen (for example, divided between the left and right pictures). Accept the integer and percentage. * indicates the occupied space. The number of values indicates the number of windows to be divided by commas. For example, cols = "30, *, 50%" can be divided into three windows. The first window is the width of 30 pixels, which is an absolute split, the second window is the space left after the first and third windows are allocated. The third window occupies 50% of the width of the entire screen and is separated. You can adjust the number by yourself.
rows = "120, *"
refers to horizontal cutting. The picture is separated up and down, and the value is set as the same as above. The Cols parameter and the rows parameter should not be in the same flag, because netacape occasionally cannot display this type of frame, so use multiple splits.
frameborder = "0"
set the frame border. The value is only 0 and 1. 0 indicates no border, and 1 indicates that the border is to be displayed. (Avoid using yes or no)
border = "0"
set the Border thickness of the frame, in pixels.
bordercolor = "#008000"
set the border color of the frame. For color values, see [color theory ].
framespacing = "5"
indicates the gap between the framework and the framework.
parameter settings:
example:

src = "a.html"
set the name of the webpage file to be displayed in this box. Each box must correspond to a webpage file. You can use absolute or relative paths. For more information about the two, see [LINK advanced ].
name = "TOP"
set the name of the window to specify the framework for linking. The name must be any one.
frameborder = 0
set the frame border. The value is only 0 and 1. 0 indicates no border, and 1 indicates that the border is to be displayed. (Avoid using yes or no)
framespacing = "6"
indicates the gap between the framework and the framework.
bordercolor = "#008000"
set the border color of the frame. For color values, see [HTML Analysis ].
scrolling = "Auto"
set whether to display the scroll. "Yes" indicates that the scroll is to be displayed. "No" indicates that no scroll is displayed in any case. "Auto" indicates that the scroll is displayed based on actual conditions.
noresize
this parameter is not set to allow users to change the size of the frame. Users can pull the frame and change its size with ease.
marginhight = 5
indicates the space reserved by some edges of the frame height.
marginwidth = 5
indicates the space reserved by the edge of the frame width.
The following are examples: (same as the composer classroom's [Application Framework])

Example HTML code
<Frameset rows = "80, *">
<Frame name = "TOP" src = "a.html">
<Frame name = "bottom" src = "B .html">
</Frameset>

Example HTML code
<Frameset rows = "80, *, 80">
<Frame name = "TOP" src = "a.html">
<Frame name = "Middle" src = "B .html">
<Frame name = "bottom" src = "c.html">
</Frameset> 

Example HTML code
<Frameset Cols = "150, *">
<Frameset rows = "80, *">
<Frame name = "upper_left" src = "a.html">
<Frame name = "lower_left" src = "B .html">
</Frameset>
<Frame name = "right" src = "c.html">
</Frameset> 

Example HTML code
<Frameset rows = "80, *">
<Frame name = "TOP" src = "a.html">
<Frameset Cols = "150, *">
<Frame name = "lower_left" src = "B .html">
<Frame name = "lower_right" src = "c.html">
</Frameset>
</Frameset>

Example HTML code
<Frameset Cols = "150, *">
<Frame name = "Left" src = "a.html">
<Frameset rows = "80, *">
<Frame name = "upper_right" src = "B .html">
<Frame name = "lower_right" src = "c.html">
</Frameset>
</Frameset>

■ <Noframes>:
When the browser used by others is too old and does not support the framework function, what he sees will be blank. To avoid this problem, you can use the <noframes> flag. When the user's browser does not see the framework, the user will see the content between <noframes> and </noframes>, instead of blank. This content can be used to remind you to switch to a new browser, or even a webpage without a framework or automatically switch to a version without a framework.
Application Method:
Add the </noframes> tag to the <frameset> tag range. The following is an example:

<Frameset rows = "80, *">
<Noframes>
<Body>
Sorry, your browser does not support the framework function. Please switch to a new browser.
</Body>
</Noframes>
<Frame name = "TOP" src = "a.html">
<Frame name = "bottom" src = "B .html">
</Frameset>
If the browser supports the framework, it will not care about the content in <noframes>. However, if the browser does not support the framework, it will skip because it does not know all the framework tags, the enclosed items are interpreted, so the text in the <noframes> range is displayed.

■ <IFRAME>:

This flag applies only to IE (comet: Also used in Firefox ). It is used to insert a window in the middle of a page to display another file. It is a blocking mark, but the surrounding words are displayed only when the browser does not support IFRAME marking, such as <noframes>. IFRAME usually works well with a javascript that identifies the browser. If JavaScript recognizes that the browser is not Internet Explorer, it switches to another version.PS: Be sure to use </iframe> to disable it. Otherwise, the subsequent content cannot be displayed.

<IFRAME> parameters are set as follows:
Example:<IFRAME src = "iframe.html" name = "test" align = "Middle" width = "300" Height = "100" marginwidth = "1" marginheight = "1" frameborder =" 1 "scrolling =" yes "> </Iframe>

src = "iframe.html"
in addition to the file name, you must add relative or absolute paths to the file source to display in this box.
name = "test"
This Box Name is required by the target parameter of the link tag,
align = "Middle"
optional values: Left, right, top, middle, bottom, little effect
width = "300" Height = "100"
width and length of the frame window, in pixels.
marginwidth = "1" marginheight = "1"
the space reserved by the inserted file and the border.
frameborder = "1"
the border is displayed with 1, and the border is not displayed with 0. (Yes or no)
scrolling = "yes"
Use yes to allow rolling (inner), and no to allow rolling.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.