Related articles:
Learn the basics of Web Authoring Tutorial (1) Web authoring
Learn the basics of Web making (2) typography labels
Learn the basics of Web page creation tutorial (3) Font label
Learn the basics of Web page creation tutorial (4) Image label
Learn the basics of Web page creation tutorial (5) Image label
Learn the basics of Web page creation Tutorial (6) Connection label
Learn the basics of Web page creation tutorial (7) Table label
Framework Concept
1. First of all, you should look at the right side of the picture, will use this picture to explain, this way, it may be clearer. We can see that the right side of this picture, divided into 1, 2, 33 frames, each frame, each has its display content is a.htm, b.htm, c.htm three files. But what is the index.htm in the lower left corner?
2. Originally, the lower left corner of the file index.htm, is to tell the browser, we want to split the page into this, that is, all the frame label, in fact, only placed in the index.htm this file .
3. That's clear! In short, you have to split a few boxes, there will be several corresponding HTML files.
Start splitting
1. Split window is a learning, to split is to step by step. Take a look at just that example, imagine the page is a cake, how do you cut to cut it like that?
| Raw code | Show results | |
| <HTML> <HEAD> <TITLE> Frame Making </TITLE> </HEAD> </HTML> |
|
2. You will find, strange, in the above grammar, how did not see <BODY></BODY> tags? Oh... Yes, it has been replaced by the <FRAMESET></FRAMESET> tags that will be added! In other words, if we want to split the page, we should first use <FRAMESET> tags to tell the browser: "I want to start segmentation!" "At this time,<body> is not useful, so hide to the side of the cool!"
3. Now open seems to split see! Let's first divide the page into the right and left sides, as shown below:
| Raw code | Show results | ||
| <HTML> <HEAD> <TITLE> Frame Making </TITLE> </HEAD> <frameset cols= "120,*" > <frame src= "a.htm" Name= " left " > <frame src= "b.htm" name= " right " > </FRAMESET> </HTML> |
|
4. In <FRAMESET>, we want to tell the browser in the end is to the left and right points (COLS)? or up and down (ROWS). At first we were left and right, so we wrote <frameset cols= "120,*". cols= "120,*" means that the column on the left is mandatory for PX, and the right is changed with the size of the browser. In addition to directly write PX number, we can also be expressed as a percentage, such as cols= "20%,80%" is also possible.
5. Then, the right side of the box and then split into the top and bottom two pages. The following figure:
| Raw code | Show results | |||
| <HTML> <HEAD> <TITLE> Frame Making </TITLE> </HEAD> <frameset cols= "120,*" > <frame src= "a.htm" Name= " left " > <frameset rows= "100,*" > <frame src= "b.htm" name= " upper right " > <frame src= "c.htm" name= " lower right " > </FRAMESET> </FRAMESET> </HTML> |
|
6. Did you see it? The original <frame src= "b.htm" name= "2" > in the 3rd syntax) was replaced by another group <frameset rows= "100,*" >! So be careful! The second group of <frameset rows= "100,*" > was surrounded by the first group <frameset cols= "120,*" >!
7. Unknowingly is done, in fact, as long as the final completion of those grammar saved into index.htm, and then prepare three files a.htm, b.htm, c.htm then completed! Of course, this is one of the best segmentation methods, and then some advanced labels in the following one by one notes.
Other label parameter description:
Example:<frameset cols= "120,*" frameborder=0 framespacing=5>
1. cols= "120,*" is the vertical cutting page! You can cut about two pages at a time, of course, can also be cut into three, very simple as long as written cols= "30,*,50" (the number of your own adjustment!) And so on, four or more of course is four sets of numbers!
2. Rows= "120,*" is the horizontal cutting page, that is, separate the page up and down, the same as the cutting method.
3. frameborder=0 sets the frame border, its value is only 0 and 1, 0 is not a border, 1 is to display a border. The border cannot be resized.
4. Framespacing=5 represents the gap between the frame and the frame, to avoid seeming too crowded.
Example:<frame src= "a.htm" name= "1" frameborderr=0 scrolling= "no" noresize marginhight=2 marginwidth=2>
1. src= "a.htm" set the name of the page to be displayed in this frame, each frame must correspond to a page, or it will produce errors, here is to you fill in the name of the corresponding page. (If the page is in a different directory, remember the path to write clearly)
2. Name= "1" Set the name of this frame, so that you can specify the framework for the connection, so be sure to set AH! Of course the name is named after your pleasure.
3. frameborderr=0 sets the frame border, its value is only 0 and 1, 0 is not a border, 1 is to display a border. The border cannot be resized.
4. scrolling= "No" to set whether to display the scroll bar, yes is to show the scroll bar, no is in any case do not show, Auto is in view of the situation. Noresize
5. noresize settings do not allow users to change the size of the box, if not set this parameter, users can easily pull the frame, change its size.
6. marginhight=2 represents the space reserved by the edge of the frame height.
7. The marginwidth=2 represents the space reserved for the edge of the frame width section.
1. <noframe>
usage:<noframe> switch to a browser that supports frame function <noframe>
Label Explanation: Some browser versions are lower and cannot display the function of the frame, so you should use this label to let these people know that it is time to change the browser. Alternatively, you can write a page tag with no frame syntax in the tag, and then the Web page without the frame syntax is automatically displayed without a browser that supports the frame function.
2. target= Frame Name
How to use: <a href= "d1-1.htm" target=3> display content </A>
Tag Explanation: There is always a situation where I want to press the connection at 1 in the box, but I want his content to appear in Frame 3 (please refer to the picture above), how should I write it? It's like adding a target= frame name on it!
3. Target=_top
How to use:< a href= "http://www.webjx.com" target=_top> Web Teaching Network </A>
Label Explanation: Sometimes, in the framework of the connection to other stations, but found that the new connection of this station, unexpectedly was framed, not only ugly, and may eat the lawsuit! So, this time you must join target=_top this parameter, then, this newly connected website, will occupy the entire browser again!
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
