Tutorial on the use of frameset tags in HTML

Brief description of HTML framework

  A browser form can be displayed by a combination of several pages. We can use frames to do this. (The framework can split an HTML document into multiple pages)

The frame page is combined in the form of a table, which can be divided into several rows and several columns.

Advantages of frames

When reloading the page, you don't need to reload the entire page, only one frame page in the page needs to be reloaded (reduces data transmission and increases page download speed)

Easy to create navigation bar

Disadvantages of frameworks

 Will generate a lot of pages, not easy to manage

 not easy to print

 Browser back button doesn't work

 The code is complex and cannot be indexed by some search engines

 Most small mobile devices (PDA phones) cannot fully display the frame

 Pages with multiple frames will increase the http request of the server

 

 Due to the many shortcomings above, it does not conform to the concept of standard web design and has been abandoned by standard web design.

 

Unlike iframes, the frameset tag cannot be used with the body tag, which may sound strange...well, let's take a look at a tutorial on how to use the frameset tag in HTML

Frameset pages are a bit different from normal web pages. While still starting with <HTML> and <HEAD> tags containing headings and other scripts, its content is merely the layout of the individual pages represented. Therefore, there is no longer a need to have the <BODY> element, only the <frameset> tag.

Attribute introduction

border: Set the border thickness of the frame.

bordercolor: Sets the border color of the frame.

frameborder: Set whether to display the frame border. The setting value is only 0, 1; 0 means no border, 1 means to display border.

cols: Split pages vertically. There are three ways to express its value: "30%, 30 (or 30px),"; the number of values ​​represents the number of divided windows and the values ​​are separated by ",". "30%" indicates that the frame area occupies 30% of the entire browser page area; "30" indicates that the horizontal width of the area is 30 pixels; "" indicates that the area occupies the remaining page space. For example: cols="25%,200,*" means that the page is divided into three parts, the left part accounts for 25% of the page, the middle horizontal width is 200 pixels, and the rest of the page is the right part.

rows: split pages horizontally. The numerical representation method and meaning are the same as cols.

 

framespacing: Sets the reserved white space between frames.

usage

Take a look at this code:

<frameset rows="*" cols="180,*" frameborder=0 border=0 >  
 <frame src="left.html" scrolling="no" noresize></frame>  
        <frame src="main.html" name="main"></frame>  
</frameset>

 

The meaning of this code is: a two-column frameset is set, the width of the left column is 180px, and noresize means that the width is fixed.

 

So, how to use frame navigation to jump to the specified section? The following code is the navigation frame on the left:

<html>  
 <head>  
  <meta charset="utf-8">  
 </head>  
 <body bgcolor="#ffffd2">  
  <ul>  
 <li><a href="./reg.html" target="main">注册用户</a></li>  
 <li><a href="./main.html" target="main">返回主页</a></li>  
  <ul>  
 </body>  
</html>

 

 

These links target the second frame. The second frame displays the linked document. The links in the navigation frame point to the specified section in the object file.

Let's take a closer look at this example:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">  
<head>  
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">  
    <title>haorooms blog frame standard demo</title>  
</head>  
<frameset row="180,*">  
    <frame name="topFrame" src="topframe.html" />  
<frame name="topFrame" src="topframe.html" />  
    <frameset cols="50%,50%">  
        <frame src="left.html" name="leftFrame" />  
        <frame src="right.html" name="rightFrame" />  
    </frameset>  
</frameset>  
</html>

 

 

Guess you like

Origin http://10.200.1.11:23101/article/api/json?id=327058685&siteId=291194637