Saturday, 23 April 2016

Create a HTML Document Using Frame Which Should Satisfy All Given Requirements

Problem:- Create an HTML document that has five frames. There must be two rows of frames, the first with three frames and the other with two frames. The frames in the first row must have equal width. The left frame in the second row must be 50 percent of the width of the display. Each of the frames in the top row must display a document that has a form. The left top frame must have two text boxes, each 30 characters wide, labeled Name and Address. The middle top frame must have five radio buttons with color name labels. The right top frame must have four checkboxes, labeled with four kinds of car equipment such as CD player and air conditioning. The two bottom frames must have images of two different cars. The top row of frames must use 20 percent of the height of the display

How to Solve:- There is no logic we just have to use the different types of the frames on our web page. frames are especially cause it makes our web page more useful. Before going for direct use of frames I recommended read the explanation section for better understanding.

Explanation:- We have to divide our web page to 2 row and first-row further divide into 3 part and the second row divides into 2 part. Now as problem requirement first row and first column design username, password and two buttons Sumit a reset button and go to first-row middle part design a radio button for various options and last in the first row and third column design checkbox for multiple choice. Now the first-row work is completed come to the second-row first column insert an image and repeat the same thing with the second row with the second column. Hence you have done check this for each section design separate part of HTML file and link with them internally.

Tip:- Always create a folder for separate web page file for avoiding unnecessary mixing and irritating and one more thing is important that always care about scrollbar in frames. Check the Output below of the program. If you are having any problem highly recommended following the given web page.

Recommendation:- Before going for this assignment follow the given assignment so you can understand all Tags very well.

1. Create an HTML page named as " SimpleTags.html ". with following tags details

2. Create A Student Registration Form Using Table  In HTML

Note:- If you have a Better design than this page and you want to publish your post with all Credit Than you are welcome to read This.

Solution:-

Copy Start From Here

Index.html

<html>
<head>
<title>My WebPage</title>
</head>

<frameset  rows="20%,*">
<frameset cols="33%,33%,*">
 <frame name = "a" src="login1.html">
 <frame name = "b" src="b.html">
 <frame name = "c" src="c.html">

</frameset>

<frameset cols="50%,*">
 <frame name="d" src="d.html">
 <frame name="e" src="e.html">
</frameset>
</frameset>
</html> 

Login.html

<html>
<head>
<title>PAGE 1</title>
</head>
<body align="center" bgcolor="#00bbba">
USER NAME<input type "textbox" size="16" > <br><br>
PASSWORD<input type "password" size="16" > <br><br>
<button type="button">SUBMIT</button> 
<button type="button">RESET</button>
</body>
</html>

Radio.html

<html>
<head>
<title>PAGE 2</title>
</head>
<body bgcolor= "aqua" >
<input type="radio" name="A" value="gasoline"><font size="4">GASOLINE</font><br>
<input type="radio" name="A" value="patrol"><font size="4">PATROL</font><br>
<input type="radio" name="A" value="diesel"><font size="4">DIESEL</font><br>
<input type="radio" name="A" value="gas"><font size="4">GAS</font><br>
<input type="radio" name="A" value="other"><font size="4">OTHER</font><br>
</body>
</html>

Checkbox.html

<html>
<head>
<title>PAGE 3</title>
</head>
<body>
<input type="checkbox" name="A" value="air conditioner"><font size="5">AIR CONDITIONER</font><br>
<input type="checkbox" name="A" value="tire"><font size="5">TIRE</font><br>
<input type="checkbox" name="A" value="light"><font size="5">LIGHT</font><br>
<input type="checkbox" name="A" value="cd player"><font size="5">CD PLAYER</font>
</body>
</html>

Img1.html

<html>
<head>
<title>Page 5</title>
</head>
<body bgcolor= "blue" >
<img src="b.jpg" border="3" height ="500" width="690" >
</body>
</html>

Ima2.html

<html>
<head>
<title>Page 4</title>
</head>
<body bgcolor= "green" >
<img src="a.jpg" border="3" height ="500" width="690" >
</body>
</html>

Copy Ends Here

Output:-



Extreme Recommended:- Like our Facebook Page or Join our Facebook Group and Google plus Community for up-to-date. If you have any Query or Question you can ask in the group, I will Try To Solve your Query and try to answers of your Questions withing 24 Hours, You can also Email me or comment below Please suggest to your Friends to join and like our page and don't forget to Subscribe. Enter your Email and click to subscribe.

Ghanendra Yadav

Ghanendra Yadav

Hello, I Am Ghanendra Yadav Owner of This Blog, I am professional Blogger and Programmer. I Love Programming, Logo Making, And Banner Designing. My Highest Qualification is MCA From NIT Warangal. You Can Find Me On Social Media Through Below Link And If You Have Any Query Related To Programming And Other Subject Comment Below or You Can Mail Me I Will Try To Answer Within 24 Hours Email:- yghanendra@student.nitw.ac.in

Find me on Social Media

Facebook | Twitter | Google+ | RSS Feed

No comments:

Post a Comment