Frame structure (frame)
Window Segmentation Technology (FRAMES) allows your browser simultaneously display multiple windows, each window displays different file content. Let readers also browse multiple HTML files at the same time and can easily switch between different images. It is like a multi-screen TV.
Each area divided by window segmentation technology is called Frame, its originality is a framework, just like a few separate pictures on the screen.
The structure of the Frames structure is substantially similar to the general HTML file, just change the HTML file main tag body to Frameset.
A typical Frames structure is as follows:
Title </ title> </ head></p>
<p><frameset> Each window content </ frameset></p>
<p></ html></p>
<p>As can be seen from this structure, all the contents of Body in ordinary HTML files are included within Frameset. That is, in the same HTML file, the frameset element cannot be used, and both cannot appear at the same time.</p>
<p>Every frame has the following features:</p>
<p>1) You can specify a corresponding URL address, and each framework of the same layout can be independently loaded into information.</p>
<p>2) You can specify the frame name as the target points to the other URL.</p>
<p>3) It can be arranged to be rolled with a variable dynamic frame, and can also be set to a size fixed static frame.</p>
<p>2. Set the frameset (Frameset)</p>
<p>Tags <frameset> </ frameset> is used to set multiple display windows, and its attribute parameters are two:</p>
<p>1) ROWS =</p>
<p>Definition The number of points to the top and bottom partitions and the height size ratio of each part.</p>
<p>Example 9-1 <frameset rows = "100, 200, 300"></p>
<p>Indicates that the window is divided into three parts, each of which is 100, 200, 300 pixel points, respectively.</p>
<p>2) COLS =</p>
<p>Define the number of pieces divided by the window and the width ratio of each portion.</p>
<p>Example 9-2 <frameset cols = "300, 200"></p>
<p>Indicates that the window is divided into two parts, each of which is 300,200 pixel points, respectively.</p>
<p>Note: In a Frameset tag, the ROWS and COLS parameters can only appear, and they cannot appear at the same time.</p>
<p>The value of the ROWS and COLS parameters is removed from the pixel point, and the percentage is relative value.</p>
<p>Example 9-3 <frameset rows = "30%, 70%"></p>
<p>Indicates that the window is divided into two parts, each accounting for 30% and 70% of the height. If the total percentage is insufficient or more than 100%, insufficient or exceeds the part will be averaged to each frame.</p>
<p>Use the "*" to represent the value of ROWS or COLS. It represents factors of each frame size.</p>
<p>Example 9-4 <frameset cols = "200, *, *"></p>
<p>Indicates that the left and right are three parts, the first part is 200 pixels, the second, and the third part each accounts for half of the remaining width.</p>
<p>Example 9-5 <Frameset Rows = "*, 2 *, 3 *"></p>
<p>Indicates that the window is divided into three parts, and its height ratio is 1: 2: 3.</p>
<p>3. Frame content tag (FRAME)</p>
<p><Frame> Tag defines the specific content of the framework. <Frame> Common parameters are:</p>
<p>1) Frame content parameter SRC =</p>
<p>Used to specify the content displayed in the window. Usually used with a URL address. SRC is the necessary parameters necessary, if not, the framework will not be content.</p>
<p>2) Framework Name Parameters Name = is used to name a frame.</p>
<p>Example 9-6 <frame src = "left.html" name = "left1"></p>
<p>Try "Left1" to the left window. Its display content is a file called "left.htm". Other windows use a similar approach to get the name for other parts. It will be convenient to specify the destination address of a LINK appearing on the window. This use is similar to the role of <A Name="8**">.</p>
<p>3) Frame boundary width: marginheight = and marginwidth =</p>
<p>The framework of the left and right, the boundary width is defined by "marginwidth =", the framework of the up and down, the boundary width is defined by "marginheight =". They are all pixel points.</p>
<p>If the boundary width is not set, it is determined by the browser yourself.</p>
<p>4) Set the frame roller: scroling =</p>
<p>The rolling strip can be horizontally, and the ordinate is simultaneously set. It has three values: Yes, NO, and AUTO, the default value is auto. Indicates that the browser automatically determines whether the roller is displayed.</p>
<p>5) The frame of the frame can change parameters: NoResize</p>
<p>When the size of the frame is changing, it can be changed. This can be used by the user with a mouse point, and then drag the mouse to make any adjustment. However, if the Moresize property is added in the Frame tag, the size of the frame is fixed unchanged.</p>
<p>4. Table format frame</p>
<p>Frameset does not bring both ROWS and COLS attribute parameters, which is to say that it can only split the window in one direction. That is, segment it up and down, or separately. Can you divide the window at the same time, and form the frame structure of the table format?</p>
<p>The answer is yes. Nested use of the Frameset tag.</p>
<p>Example 9-7, to split the window to two equivalents, the upper part is divided into left and right parts, the size ratio is 30%, 70%. The lower half is divided into three equivalents, and the following labels can be used:</p>
<p><Frameset Rows = "50%, 50%></p>
<p><frameset cols = "30%, 70%"> </ frameset></p>
<p><frameset cols = "*, *, *"> </ frameset></p>
<p></ frameset></p>
<p>The first line, segment the screen, second, three behavior sub-frame (Subframe). The second line divides the upper half into two parts, and the third line divides the lower half into three equals. The fourth behavior ends of the outer Frameset.</p>
<p>5. Adapt to the browser that does not support the frame <NOFRAME></p>
<p>There are many low version of the browser that does not support the HTML file of the frame structure, the display of the frame structure HTML files in this type of browser becomes a confusion, or there is no display at all. In order to use the user who does not support the Frame browser, you can use the NOFRAME tab to display the contents to the NOFRAME tag. When such a user browsses, the Frame tag is ignored, but the content in <NOFRAME> will display normally, just Unsecured window. When using a browser that supports Frame, <NOFRAME> tag is ignored, and the contents of <frame> will be displayed normally in the split window.</p>
<p>Here is a complete example:</p>
<p>Example 9-7Frame instance (this example can only display the split window on a version higher than Netscape 2.0.)</p>
<p><html></p>
<p><head> <title> frame instance </ title> </ head> <frameset rows = "50%, 50%"></p>
<p><frameset cols = "30%, 70%"></p>
<p><frame src = "left1.htm" name = "left1" NORSIZE "</p>
<p><frame src = "Right1.htm" Name = "Right1"></p>
<p></ frameset></p>
<p><frameset cols = "35%, 65%"></p>
<p><frame src = "left2.htm" name = "left2"></p>
<p><frame src = "Right2.htm" name = "Right2" scroling = no></p>
<p></ frameset></p>
<p></ frameset></p>
<p><NOFRAME></p>
<p><center></p>
<p><H3> When you use a browser that does not support Frame, <br></p>
<p>Will only see this information !! <h3></p>
<p></ center></p>
<p><NOFRAME></p>
<p></ html></p>
<p>Split the browser window into four parts: named: Left1, Right1, LEFT2 and RIGHT2. The display content of these four windows is four html files: left1.htm, right1.htm, left2.htm, right2.htm, their source code as follows:</p>
<p>LEFT1.HTM:</p>
<p><html> <head> <title> frame left1 </ title> </ head></p>
<p><body> <h2> frame LEFT1 display </ h2> </ body> </ html></p>
<p>Right1.htm:</p>
<p><html> <head> <title> Frame Right1 </ Title> </ hEAD></p>
<p><body> <h2> Frame Right1 display </ h2> </ body> </ html></p>
<p>LEFT2.HTM:</p>
<p><html> <head> <title> frame left2 </ title> </ head></p>
<p><body> <h2> frame LEFT2 display content </ h2> </ body> </ html></p>
<p>LEFT1.HTM:</p>
<p><html> <head> <title> frame Right2 </ Title> </ hEAD></p>
<p><body> <H2> Frame Right2 display content </ h2> </ body> </ html></p>
<p>The display is shown in Figure 9.1 in the browser.</p>
<p>Figure 9.1Frame instance shows</p>
<p>As seen from the figure:</p>
<p>1) Each framework is equivalent to a complete browsing window.</p>
<p>2) Since Left1 sets the NORESize parameter, its size cannot be touched by dragging the mouse. Thus affecting the boundaries of the upper and lower parts cannot be changed, the relative size of LEFT2 and RIGHT2 can be arbitrarily adjusted.</p>
<p>3) When the content of a frame cannot be displayed all, the rolling strip appears, prompting the user to display the rest of the rest by dragging the roller strip. When the direction content can be fully displayed, the roll strip does not appear (such as the horizontal direction of Letf1). If a frame sets the parameters: scrolling = "no"</p>
<p>The rolling strip does not appear (Right2).</p>
<p>4) This example is part of the content is surrounded by the NOFRAME tag. This part is not shown in Figure 9.1. However, if you do not support the Frame structure, you can only see this section, and you can't see the split window.</p>
<p>6. Application of Frames Structure</p>
<p>Using the framework can split the window into their own separate parts, we can design some of the very distinctive HTML files.</p>
<p>One of the ideas is: Put the readers often see the screen, such as a directory, control button, the subject sign, copyright statement, the author address, etc. in a static frame, and do not flow with the screen. Enables readers to query anytime.</p>
<p>Another part of the dynamic framework relative to the static frame is used to display a lot of information for browsing. While reading, the reader can find the directory or control button from the static framework at any time, and hop the switches as you want. Greatly improve query efficiency.</p></div><div class="text-center mt-3 text-grey">
转载请注明原文地址:https://www.9cbs.com/read-84757.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>)
</div><div></div></div></div><ul class="postlist list-unstyled">
</ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="84757" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved
</div><div class="col text-right">Processed:
<b>0.049</b>, SQL:
<b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script>
var debug = DEBUG = 0;
var url_rewrite_on = 1;
var url_path = './';
var forumarr = {"1":"Tech"};
var fid = 1;
var uid = 0;
var gid = 0;
xn.options.water_image_url = 'view/img/water-small.png';
</script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script>
var forum_url = 'list-1.html';
var safe_token = 'IAtifZncaOGw_2FBLpWpAoeW6OEh55kFUESm7jx9cncajOdC4PJt4VEvDci3kUEdTZD9JpSlnN_2F6HA2BqHCCN77g_3D_3D';
var body = $('body');
body.on('submit', '#form', function() {
var jthis = $(this);
var jsubmit = jthis.find('#submit');
jthis.reset();
jsubmit.button('loading');
var postdata = jthis.serializeObject();
$.xpost(jthis.attr('action'), postdata, function(code, message) {
if(code == 0) {
location.reload();
} else {
$.alert(message);
jsubmit.button('reset');
}
});
return false;
});
function resize_image() {
var jmessagelist = $('div.message');
var first_width = jmessagelist.width();
jmessagelist.each(function() {
var jdiv = $(this);
var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width();
var jmessage_width = Math.min(jdiv.width(), maxwidth);
jdiv.find('img, embed, iframe, video').each(function() {
var jimg = $(this);
var img_width = this.org_width;
var img_height = this.org_height;
if(!img_width) {
var img_width = jimg.attr('width');
var img_height = jimg.attr('height');
this.org_width = img_width;
this.org_height = img_height;
}
if(img_width > jmessage_width) {
if(this.tagName == 'IMG') {
jimg.width(jmessage_width);
jimg.css('height', 'auto');
jimg.css('cursor', 'pointer');
jimg.on('click', function() {
});
} else {
jimg.width(jmessage_width);
var height = (img_height / img_width) * jimg.width();
jimg.height(height);
}
}
});
});
}
function resize_table() {
$('div.message').each(function() {
var jdiv = $(this);
jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>');
});
}
$(function() {
resize_image();
resize_table();
$(window).on('resize', resize_image);
});
var jmessage = $('#message');
jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); });
jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); });
$('#nav li[data-active="fid-1"]').addClass('active');
</script>
