& Lt; frameset & gt; tag in html, parent Menu Sub-menu relationship of each window in the framework structure, and frameset Menu Sub-

Source: Internet
Author: User

<Frameset> label in html, parent Menu Sub-menu relationship of each window in the framework structure, and frameset Menu Sub-

This problem is too big for me, and I cannot understand the explanations provided by Baidu. It should be the reason why I am too white. I hope I can understand it well.

In the following articles, Windows 1, 2, and 3 are displayed in the Code: chuangkou, chuangkou1, and chuangkou2.

The following is a simple html framework structure I have created:

 

 

 

 

To create this webpage, you need eight html files, which define the framework respectively:

<! DOCTYPE html>
<Html>
<Head> <title> hotel background Operating System </title>

<Frameset rows = "30%, *" frameborder = "1" borde = "5" bordercolor = "#446677">
<Frame src = "/application/index/view/index/guanli.html"Name = "chuangkou"Scrolling = "aulo" noresize>
<Frameset cols = "30%, 70%">
<Frame src = "/application/index/view/index/zhufang.html"Name = "chuangkou1"Scrolling = "aulo" noresize>
<Frame src = "/application/index/view/index/afangjian.html"Name = "chuangkou2"Noresize>

</Frameset>

</Frameset>
</Html>

This Code divides the webpage into three parts:Name = "chuangkou ";Name = "chuangkou1 ";Name = "chuangkou2 ",That is, the rough code in the above Code: window, window 1, window 2.

 

 

 

 

The code for the top option window is as follows:

<! DOCTYPE html>
<Html>
<Head>
<Meta charset = "UTF-8">
<Title> </title>
<Style type = "text/css" media = "screen">
P {font-size: 30px ;}
</Style>
</Head>
<Body>
<Font color = "blue" align = "center"> <P align = "center">
<A href = "/application/index/view/index/zhufang.html"Target = "chuangkou1"> Housing query </a> & nbsp; & nbsp;
<A href = "/application/index/view/index/xiaofei.html"Target = "chuangkou1"> Consumption query </a>
</P>
</Body>
</Html>

This code is called in the top menu barName = "chuangkou,The location of the target in the housing query and consumption query of the tag <a> is the location in the second window. It can be understood that the target is the channel. When we click the housing query, the option of Zone A and Zone B in "zhufang.html" is the location of the terminal chuangkou1.

 

<! DOCTYPE html>
<Html>
<Head>
<Title> </title>
</Head>
<Body>
<A href = "/application/index/view/index/afangjian.html" target = "chuangkou2"> room a </a> <br>
<A href = "/application/index/view/index/bfangjian.html" target = "chuangkou2"> Room B </a>
</Body>
</Html>

 

The code above is the code after clicking the housing information in the window.

 

 

 

 

 

 

 

 

When we click "afangjian.html" in the corner of Area A, the target is used to access chuangkou2.

 

 

Vodafangjian.html "code is as follows:

<! DOCTYPE html>
<Html>
<Head>
<Title> </title>
</Head>
<Body>
<P> This is Room A </p>
<P> This is Room A </p>
<P> This is Room A </p>
<P> This is Room A </p>
<P> This is Room A </p>
<P> This is Room A </p>
<P> This is Room A </p>
</Body>
</Html>

 

The remaining consumption query and Zone B room query are the same.

 

Additional code

 

<! DOCTYPE html>
<Html>
<Head>
<Title> </title>
</Head>
<Body>
<P> This is Room B </p>
<P> This is Room B </p>
<P> This is Room B </p>
<P> This is Room B </p>
<P> This is Room B </p>
<P> This is Room B </p>
<P> This is Room B </p>
</Body>
</Html>

 

Consumption query code

<! DOCTYPE html>
<Html>
<Head>
<Title> </title>
</Head>
<Body>
<A href = "/application/index/view/index/paomian.html" target = "chuangkou2"> instant noodles </a> <br>
<A href = "/application/index/view/index/yinliao.html" target = "chuangkou2"> drinks </a>
</Body>
</Html>

 

Bubble code

<! DOCTYPE html>
<Html>
<Head>
<Title> </title>
</Head>
<Body>
<P> This is instant noodle consumption. </p>
<P> This is instant noodle consumption. </p>
<P> This is instant noodle consumption. </p>
<P> This is instant noodle consumption. </p>
<P> This is instant noodle consumption. </p>
<P> This is instant noodle consumption. </p>
<P> This is instant noodle consumption. </p>
<P> This is instant noodle consumption. </p>
<P> This is instant noodle consumption. </p>
</Body>
</Html>

Beverage code

<! DOCTYPE html>
<Html>
<Head>
<Title> </title>
</Head>
<Body>
<P> This is beverage consumption. </p>
<P> This is beverage consumption. </p>
<P> This is beverage consumption. </p>
<P> This is beverage consumption. </p>
<P> This is beverage consumption. </p>
<P> This is beverage consumption. </p>
<P> This is beverage consumption. </p>
<P> This is beverage consumption. </p>
<P> This is beverage consumption. </p>
</Body>
</Html>

 

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.