Community Learn Tools Library Leisure
search
English
Home > Web Front-end > HTML Tutorial > How to use HTML framework

How to use HTML framework

墨辰丷
Release： 2018-06-04 15:40:33
Original
8104 people have browsed it

A browser document window can only display one web page file, but you can display more than one page in the same browser window by using frames. This article will introduce the HTML frame

1. Frame

A browser document window can only display one web page file, but you can display more than one page in the same browser window by using frames. Pages that use frames mainly include two parts, one is the frame set, and the other is the specific frame file.

Frames are mostly used for the layout of website backends or intranet systems.

1. Frame set (): is a file used to define this HTML document as a frame mode and set how the window is divided. In layman's terms, a frameset is a file that stores the frame structure and is also an entry file for accessing frame files. If a web page consists of two left and right frames, then in addition to the two left and right web page files, there is also a general frame set file. In pages that use frames, the tag is replaced by the frame tag . Each frame contained in the frame page is defined through the tag.

rows attribute: Split the window horizontally. Horizontally split windows are to cut the page in the horizontal direction, that is, to divide the page into multiple windows arranged up and down. Rows can take multiple values, each value represents the horizontal width of a frame window, and its unit can be pixels or a percentage of the browser. However, it should be noted that generally when several rows values ​​are set, several frames are required, that is, a corresponding number of parameters are required. 

  <html>
  
  <head>
  
  <title>水平分割窗口的效果</title>
  
  </head>
  
 <frameset rows="30%,70%">
 
     <frame>
 
     <frame>
 
 </frameset>
 
 </html>
Copy after login

cols attribute: vertically split window. Vertically splitting a window means dividing the page into multiple windows in the vertical direction, that is, dividing the page into multiple windows arranged left and right. cols can take multiple values, each value represents the horizontal width of a frame window, and its unit can be pixels or a percentage of the browser. Similar to the horizontal split window, generally setting several cols values ​​requires several frames, that is, several parameters. 

  <html>
  
  <head>
  
  <title>垂直分割窗口的效果</title>
  
  </head>
  
<frameset cols="20%,55%,25%">
 
     <frame>
 
     <frame>
 
     <frame>
 
 </frameset>
 
 </html>
Copy after login

frameborder attribute: Set the border. By default, there is a border line around the frame window, and the display of the border line can be adjusted through the frameborder parameter. The syntax is:

or . The value of frameborder can only be 0 or 1. If the value is 0, the border line will be hidden; if the value is 1, the border line will be displayed. Setting it in frameset will be effective for the entire frame, and setting it in frame will be effective only for the current frame. 

  <html>
  
  <head>
  
  <title>设置框架窗口的边框显示效果</title>
  
  </head>
  
  <frameset rows="20%,55%,25%">
 
 <frame frameborder="1">
 
 <frameset cols="35%,65%" frameborder="0">
 
 <frame >
 
 <frame>
 
 </frameset>
 
 <frame frameborder="0">
 
 </frameset>
 
 </html>
Copy after login

framespacing attribute: The border width of the frame. The border width of the frame is 1 pixel by default, and its size can be adjusted through the parameters framespacing.

Syntax:

Description: The frame width is the width of the lines between the borders on the page, in pixels. This parameter can only be used for framesets and is not valid for a single frame. 

  <html>
  
  <head>
  
  <title>设置框架的边框宽度</title>
  
  </head>
  
 <frameset rows="30%,70%" framespacing="10">
     <frame>
 
       <frameset cols="20%,55%,25%" framespacing="30">
 
         <frame>
 
         <frame>
 
         <frame>
 
       </frameset>
 
 </frameset>
 
 </html>
Copy after login

bordercolor property: The border color of the frame. Use the parameter bordercolor to set the border color of the frameset.

Syntax:

Description: This parameter is also only valid for the entire frameset, not for a single frame. 

  <html>
  
  <head>
  
  <title>设置框架的边框颜色</title>
  
  </head>
  
 <frameset rows="30%,70%" framespacing="10" bordercolor ="#CC99FF">
 
     <frame>
 
      <frameset cols="20%,55%,25%" framespacing="30" bordercolor ="#9900FF">
 
         <frame>
 
         <frame>
 
         <frame>
 
       </frameset>
 
 </frameset>
 
 </html>
Copy after login

2. Frame () and src attributes.

Each page in the frame structure is a separate text, and these files are set through the src parameter.

Syntax:

Description: The page file is where the specific content of the frame page is located. For frames that do not have a source file set, it is just blank. The page has no effect. The source file of the page can be a normal HTML file, or it can be an image or other file. 

  <html>
  
  <head>
  
  <title>设置页面源文件</title>
  
  </head>
  
 <frameset rows="30%,70%">
 
     <frame src="pic01.gif">
     <frame src="src01.html">
 
 </frameset>
 
 </html>
Copy after login

3. tag

## tag is used to display when the browser does not support frames Page content. 

  <html>
 <frameset cols="25%,50%,25%">
    <frame src="/example/html/frame_a.html">
    <frame src="/example/html/frame_b.html">
    <frame src="/example/html/frame_c.html">
  <noframes>
  <body>您的浏览器无法处理框架！</body>
  </noframes>
  </frameset>
 </html>
Copy after login

2. Floating frame (

Description: Similar to the ordinary frame structure, the floating frame can also set many parameters, such as name, scrolling, frameborder, etc. But compared with ordinary frames, floating frames do not contain framespacing and bordercolor parameters.

src属性：浮动框架中最基本的参数就是src，它用来设置浮动框架页面的源文件地址，也是浮动框架页面必需的参数。因为只有设置了源文件的内容，浮动框架才有意义。语法：