the difference of 10.4 Frame, Iframe and Frameset
Frame page has frame, Iframe, Frameset 3 marks, beginners easy to confuse the three, the following respectively explain the difference between the three. the difference between 10.4.1 frameset and frame
First, explain the difference between frameset and frame.
<Frameset></Frameset> is used to divide the frame, each frame by <Frame></Frame> tag. <Frame></Frame> must be used within <Frameset></Frameset>, the code is as follows:
<frameset border=1 framespacing=1 bordercolor= #47478d rows=* cols=180,*>
<frame src= "inc/admin_left.htm" Name=left scrolling=no id= "left" >
<frame src= "inc/admin_center.htm" Name=main scrolling= "no" >
</FRAMESET>
In the above example,<frameset></frameset> the page is divided into about two parts, the left frame of the page is admin_left.htm, the right frame of the page is admin_center.htm.
Note the frame order of the:<frame></frame> tag is left-to-right or from top to bottom.
The difference between the two is as follows:
<Frameset> for the frame tag, describe the Web page document as a frame, and set the layout of the frame in the document that makes up the frame set.
<Frame> sets the properties that make up each frame in the frameset. 10.4.2 Frameset Parameter setting
<Frameset> need to set some specific parameters, which directly determine the layout of the entire page, the code is as follows:
<frameset border=1 framespacing=1 bordercolor= #47478d rows=* cols=180,*>
The various parameter settings for the previous code and their meanings are shown in table 10.3.
Table 10.3 Frameset Parameters
Parameters |
Description |
Border |
Sets the border thickness of the frame, in pixels |
Frameborder |
Sets whether the frame is displayed, 0 is not displayed, and 1 is displayed |
Framespacing |
Represents the distance between a frame and a frame |
BorderColor |
Set the border color of a frame |
Row |
The document is divided into the upper and lower frames, row values can be a value or a percentage, * represents the rest of the space, the number of numbers represents the level of the number of frames, such as rows= "210,*,10%", said that the page is divided into the next three frames page, the top frame occupies 210px, The bottom frame occupies 10% of the entire document, and the remaining space is occupied by the middle frame. * is a relative concept, such as row=*, that represents a frame layout with no upper and lower structure in the page |
Cols |
Set the same row |
10.4.3 Frame parameter setting
For the setting of the frame parameter, the code is as follows:
<frame name= "left" src= "index_manager/admin_left.htm" marginwidth= "1" marginheight= "1" scrolling= "no" frameborder = "1" noresize framespacing= "2" bordercolor= "#cc0000" >
The parameter settings for the previous code and their meanings are shown in table 10.4.
Table 10.4 Frame Parameters
Parameters |
Description |
Name |
Set the name of the frame to be in English |
Src |
Sets the page path and name displayed in the frame, which can be a relative path or an absolute path |
Marginwidth |
Indicates the distance between the frame and the left and right edges |
Marginheight |
Indicates the distance between the frame and the top and bottom edges |
Scrollling |
Sets whether scroll bars are displayed in frames, yes is displayed, no is not displayed, and auto means scroll bars are automatically displayed when content in frames page exceeds the frame in large hours |
Frameborder |
Sets whether frame borders are displayed, 0 is not displayed, 1 is displayed |
Noresize |
Set whether the user can change the size of the frame, do not set this allows the viewer to arbitrarily pull the frame, change the size of the frame |
Framespacing |
Represents the distance between a frame and a frame |
BorderColor |
Set the border color of a frame |
the difference between 10.4.4 frame and IFrame
The functions of frame and IFRAME are basically the same, but the IFRAME has more flexibility than frame.
The IFRAME tag is also called a floating frame marker, which you can use to embed an HTML document in an HTML display. The biggest difference between it and the Frame tag is that the embedded <Iframe></Iframe> in the Web page is a whole page, and the <Frame></Frame> contains a single individual , it can be displayed independently. In addition, the application of an IFRAME can also display the same content multiple times on the same page without having to repeat the code for that piece of content.
As shown in Figure 10.21 of the page is the application of the IFRAME in the page to create a page of the link, up and down the code is the same, just embed the same file in the Web page, do not need to write a duplicate code, the actual effect of this case refer to the case of the CD-ROM/frame/iframe/see_ Infomore_iframe.htm. 10.4.5 set IFRAME transparent
An even bigger advantage of IFRAME is that you can set the frame to be transparent so that the background within the frame is the same as the home page background. In the previous example, the attentive reader will find the problem, and the following details how to set up iframe transparency. The specific steps are as follows:
(1) Open the case/frame/iframe/see_infomore_iframe1.htm in the CD.
(2) Browse the page file in the browser and find that the background of the original cell is overwritten in the area where the IFRAME is inserted, which is not the desired effect.
(3) Open the Page.htm page, switch to Code view, insert the code in the <body> tag as follows:
<body style= "Background-color=transparent" >
Figure 10.21 Applying an IFRAME to create a page
(4) switch see_infomore_iframe1.htm to Code view, and view the code for the page that inserts the IFRAME as follows:
<TD height= "colspan=" 4 ">
<iframe name= "main" width= "100%" height= "" frameborder= "0" border=0 scrolling= "no" marginwidth= "0" marginheight= " 0 "src=" page.htm "></iframe>
</td>
(5) in the <Iframe> tag, insert the code as follows:
Allowtransparency= "true"
(6) The cell code that inserts the IFRAME at this point is as follows:
<TD height= "colspan=" 4 ">
<iframe name= "main" width= "100%" height= "" frameborder= "0" border=0 scrolling= "no" marginwidth= "0" marginheight= " 0 "src=" page.htm "allowtransparency=" true "></iframe></td>
(7) Save page.htm and see_infomore_iframe1.htm two pages, browsing the effect in the browser.
10.5 Summary of this chapter
The framework can be divided into different windows, through the framework to establish links between the site to achieve the unity of style. This chapter mainly introduces how to create the framework, as well as the framework of the properties and frame, Iframe, frameset differences between the application of noframe can also effectively optimize the page, so that the search engine can correctly index the content information on the frames page, Breaking through the frames of the Web page cannot be restricted by search engine indexing correctly.
The framework is dominant until the template is present. The application framework can establish fast links, accelerate the browsing speed of the Web site, improve the efficiency of the browser, because of this advantage, frames pages are widely used in navigation.