Scribd
Upload
5 views10 pages

wip unit 1 program

The document contains multiple HTML forms including a grocery order form, a resume, a feedback form, and a college information page. Each form collects different types of user input, such as product selection, personal details, and college information. The document also includes a CSS file for styling the feedback form.

Uploaded by

priya j
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
5 views10 pages

wip unit 1 program

The document contains multiple HTML forms including a grocery order form, a resume, a feedback form, and a college information page. Each form collects different types of user input, such as product selection, personal details, and college information. The document also includes a CSS file for styling the feedback form.

Uploaded by

priya j
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 10

Unit1:

1) Grocery order form:

<html>

<head>

</head>

<body>

<h1>Grocery order form</h1>

<form>

My products:

<input type="text" placeholder="search" ><br>

List rate for 1/2 kg:<br>

<input type="checkbox" id=" 1" >

<label for="1"> Apple - Rs.30</label><br>

<input type="checkbox" id=" 2" >

<label for="2"> orange - Rs.40</label><br>

<input type="checkbox" id=" 3" >

<label for="3"> carrot - Rs.80</label><br>

<input type="checkbox" id=" 4" >

<label for="4"> potato - Rs.60</label><br>

customer name:

<input type="text" ><br>

phone number:

<input type="phone no" ><br>

Address:

<input type="text" ><br>

<input type="button" value="order" >

</form>
</body>

</html>

OUTPUT:

2)Resume using html:

<html>

<head></head>

<body>

<div id="header"></div>

<div class="left"></div>

<div class="stuff">

<br><br>

<h1>Resume</h1>

<h2>Emily</h2>

<hr />

<br>

<p class="head">Interests</p>
<ul>

<li>Drawing</li>

<li>Photography</li>

<li>Design</li>

<li>Programming</li>

<li>Computer Science</li>

</ul>

<p class="head">Skills</p>

<ul>

<li>Web Design with HTML & CSS</li>

</ul>

<p class="head">Education</p>

<ul>

<a href="http://www.wiltonhighschool.org/pages/Wilton_High_School">

<li>Wilton High School</li>

</a>

<!--Link-->

<a href="https://www.silvermineart.org/">

<li>Silvermine School of Arts</li>

</a>

<li>Codeacademy</li>

</ul>

<p class="head">Experience</p>

<ul>

<li>Student Technology Intern for Wilton School District</li>

<li>Babysitter</li>

</ul>
<p class="head">Extracurriculars</p>

<ul>

<li>Recycling Club</li>

<li>Gardening Club</li>

<li>Book Club</li>

</ul>

</div>

<div class="right"></div>

<div id="footer">

<h2 id="name">Emily</h2></div>

</body>

</html>
3)feeback form:

<html>

<head>

<link rel= stylesheet href="123.css" type="text/css" >

</head>
<body>

<form action="" method="POST">

<label for="fullName">Your Name</label> <br>

<input type="text" name="fullName"><br><br>

<label for="gender">Your Gender</label> <br>

<input type="radio" name="gender" value="male">Male<br>

<input type="radio" name="gender" value="female">Female<br><br>

<label for="email">Your E-mail</label> <br>

<input type="text" name="email"><br>

<br>

<label for="comments">Your Comments</label> <br>

<textarea name="comments"></textarea><br><br>

<input type="submit" value="Submit">

<input type="reset" value="Clear">

</form>

</body>

</html>

123.css:

form {

width: 400px;

background-color: lightblue;

text-align: center;

padding: 20px;
}

input, textarea {

padding: 12px;

margin: 9px 9px 6px 6;

input[type=submit] {

background-color: green;

color: white;

padding: 12px 20px;

input[type=reset] {

background-color: red;

color: white;

padding: 12px 20px;

Output:
4) Write and discuss an HTML script which creates a web page which should display some
of the egg. Colleges in Tamil Nadu in a tabular form with name, address and URL of the web
site of the college. A candidate should select the required department which is listed as
items from a form. Candidate’s selection should be consolidated and displayed finally.

<html>
<head>
<title> colleges in tamilnadu</title>

<center><h4>colleges in tamilnadu</h4>
</head>
<body>
<form>
<table width="70%" border=3>
<tr>
<th>name</th>
<th>address</th>
<th>url</th>
</tr>
<tr>
<td>krce</td>
<td>samyapuram,trichy</td>
<td>http.krce.com</td>
</tr>
<tr>
<td>krct</td>
<td>samyapuram,trichy</td>
<td>http.krce.com</td>
</tr>
<tr>
<td>psg</td>
<td>coimbatore</td>
<td>https.psg.com</td>
</tr>
<tr>
<td>GCE</td>
<td>srirangam,trichy</td>
<td>http.gce.com</td>
</tr>
</table><br>
<b> select department</b>
<select>
<option>cse</option>
<option>ece</option>
<option>eee</option>
<option>IT</option>
</select><br>

Results of cse students

<table width="50%" border="3">

<tr>

<th>S.NAME</th>

<th>MARKS</th>

<th>RESULT</th>

</tr>

<tr>

<td >Dinesh</td>

<td>100</td>

<td >pass</td>

</tr>

<tr>
<td >Bala</td>

<td>99</td>

<td >pass</td>

</tr>

<tr>

<td >Gopi</td>

<td>98</td>

<td>pass</td>

</tr>
</table>
</table>
</form>
</center>
</body>
</html>

Ouput:

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy