Download as docx, pdf, or txt
Download as docx, pdf, or txt
You are on page 1of 61

1.

Create a web page to display the following output: (use textboxes,


submit button)

<html>
<body>
<form>
Name:
<input type="text" name="Name"><br><br>
Address:
<input type="text" name="Address"><br><br>
<input type="submit" value="submit">
</form>
</body>
</html>
2. Create a web page to display the time table of your class using tables.

<html>
<head></head>
<body>
<table border=3 cellpadding=2 cellspacing=2 align=<center>
<caption><center> TIME TABLE</center></caption>
<tr>
<td>&nbsp;
<td>1<sup>st</sup>hour
<td>2<sup>nd</sup>hour
<td>3<sup>rd</sup>hour
<td>4<sup>th</sup>hour
<td rowspan=7>B<br>R<br>E<br>A<br>K
<td>5<sup>th</sup>hour
<td>6<sup>th</sup>hour
</tr>
<tr>
<td>MON
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
</tr>
<tr>
<td>TUE
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
</tr>
<tr>
<td>WED
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
</tr>
<tr>
<td>THR
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
</tr>
<tr>
<td>FRI
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
</tr>
<tr>
<td>SAT
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
</tr>
</table>
</body>
</html>
3. Create a web page which accepts user input as shown below.

<html>
<body>
<form>
Name:
<input type="text" name="Name"><br><br>
Address:
<input type="text" name="Address"><br><br>
state:
<input type="text" name="state"><br><br>
city:
<input type="text" name="city"><br><br>
pincode:
<input type="text" name="pincode"><br>
<br>
<input type="submit" value="place your order">
</form>
</body>
</html>
4. Create a web page to modify the default properties of h1 tag using
internal style sheet.

<html>
<head>
<title>Inline Sstyle Sheets </title>
</head>
<body>
<h1 style="font-size:50pt; color:red">
About inline style sheets </h1>
<p style=" font-family:arial;color:green">
Sree Venkateshwara Degree College of Commerce</p>
</body>
</html>
5. Create a web page to display an ordered list of courses offered in
your college.

<html>
<head>
<title>ordered lists in html</title></head>
<body>
<h1> Sree Venkateshwara Degree College of Commerce </h1>
<h2>COURSES OFFERED</h2>
<ol>
<li>B.com(com)
<li>B.sc(com)
<li>B.com(gen)
<li>B.com(comp.App)
</ol>
</body>
</html>
6. Create a web page to display a table with 2 rows and 2 columns. Also
insert images in the cells of the table.
<html>
<body>
<table border=3>
<tr>
<td height="30" width="30">&nbsp;
<td height="30" width="30">&nbsp;
<img src="C:\Users\Public\Pictures\Sample Pictures\Desert.jpg"
height="30" width="30">
</td>
<tr>
<td height="30" width="30">&nbsp;
<td height="30" width="30">&nbsp;
</tr>
</table>
</body>
</html>
7. Create a web page to display a hyperlink which when clicked directs
you to Amazon website.
<html>
<head>
<title>
Creating HyperLinks
</title>
</head>
<body>
<a href="https://www.amazon.in">amazon</a>
</body>
</html>
8. Create a web page to demonstrate various marquee effects over a
given text.
<html>
<head>
<tilte>
marquee
</title>
</head>
<body>
<marquee behavior="slide" direction="left"> Sree Venkateshwara
Degree College of Commerce </marquee>
<marquee behavior="scroll" direction="left"> Sree Venkateshwara
Degree College of Commerce </marquee>
<marquee behavior="alternate"> Sree Venkateshwara Degree College of
Commerce </marquee>
<marquee behavior="scroll" direction="up"> Sree Venkateshwara
Degree College of Commerce </marquee>
</body>
</html>
9. Create a web page to display the following output: (take your own
data into consideration)

<html>
<body>
<table border=3 align="center">
<tr>
<th colspan="3">Title</th>
</tr>
<tr>
<td>This is Desert</td>
<td>
<img src="C:\Users\Public\Pictures\Sample Pictures\Desert.jpg"
height="50" width="50">
</td>
</tr>
</table>
</body>
</html>
10. Create a web page to display the following output:
(a+b)2=a2+2ab+b2
H2SO4
<html>
<body>
(a+b)<sup>2</sup>=a<sup>2</sup>+2ab+b<sup>2</sup>
<br>
h<sub>2</sub>so<sub>4</sub>
</body>
</html>
11. Create a web page to demonstrate the usage of nested tables as
shown in the diagram below:

<html>
<body>
<table border="2">
<tr>
<td>
<table border="2">
<tr>
<td>Rubber</td>
<td>baby</td>
<td>she</td>
<td>sells</td>
<tr>
<td>buggy</td>
<td>bumpers</td>
<td>sea</td>
<td>shells</td>
</tr>
</td>
</table>
</body>
</html>
12. Create a web page which acts as a home page where your college
name is properly aligned with the logo of your college followed by
address and contact details at the center of the page.

<html>
<body bgcolor="green">
<center>
<h1>
SREENIDI DEGREE COLLEGE
</h1>
</CENTER>
<img src="C:\Users\student14\Downloads\IMG_20190223_112354.jpg"
height="300" width="300">
</img>
<CENTER>
ADDRESS:
Sree Venkateshwara Degree College of Commerce <BR>
Neo Royal School Building<BR>
contact No:8143304050<BR>
Karmanghat<BR>
</CENTER>
</body>
</html>
13. Create a web page to demonstrate definition lists by taking various
applications of ecommerce as an example.

<html>
<head>
<title>
creating Definition Lists
</title>
</head>
<body>
<dl>
<dt>E-marketing</dt>
<dd>electronic marketing</dd>
<dt>E-Banking</dt>
<dd>Electronic Banking</dd>
<dt>M-commerce</dd>
<dd>mobile commerce</dd>
</dl>
</body>
</html>
14. Create a web page to display a bulleted list of subjects available in
the current semester.
<html>
<head>
<title>
Creating Bulleted Lists
</title>
</head>
<body>
<ul>
<li>RDBMS</li>
<li>Ecommerce</li>
<li>commerce lab</li>
<li>GST</li>
</ul>
</body>
</html>
15. Create a web page to give scrolling effect of an image (preferably
your college logo).
<html>
<head>
<title>
scrolling image
</title>
</head>
<body>
<marquee>
<img src="C:\Users\student14\Downloads\IMG_20190223_112354.jpg"
height="300" width="300">
</img>
</marquee>
</body>
</html>
16. Create a web page to display a button which when clicked directs
you to your college website.
<html>
<head>
<title>
creating hyperlink
</title>
</head>
<body>
<a href=" http://www.sreenidhi.org/. ">SVDC</a>
</a>
</body>
</html>
17. Create a web page to display various courses in your college. The
courses should be separated by a horizontal ruler of varying sizes and
colors.
<html>
<head>
<title>
creating Horizontal Rulers
</title>
</head>
<body>
<hr color="red">
<h1>B.com</h1>
<hr color="green">
<h2>B.sc</h2>
<hr color="blue">
<h3>B.com(Gen)</h3>
<hr color="yellow">
<h4>B.com(comp.App)</h4>
<hr>
</body>
</html>
18. Create a web page to display four horizontal frames each frame
containing a different color.

<html>
<head>
<frameset cols="25%,25%,25%,25%">
<frame src="a.html">
<frame src="b.html">
<frame src="c.html">
<frame src="d.html">
</frameset>
</head>
</html>

a.html:
<html>
<body bgcolor="red">
</body>
</html>
b.html
<html>
<body bgcolor="green">
</body>
</html>
c.html
<html>
<body bgcolor="blue">
</body>
</html>
d.html
<html>
<body bgcolor="yellow">
</body>
</html>
19. Create a web page to display four vertical frames each frame
containing a different color.
<html>
<head>
<frameset rows="25%,25%,25%,25%">
<frame src="a.html">
<frame src="b.html">
<frame src="c.html">
<frame src="d.html">
</frameset>
</head>
</html>

a.html:
<html>
<body bgcolor="red">
</body>
</html>
b.html
<html>
<body bgcolor="green">
</body>
</html>
c.html
<html>
<body bgcolor="blue">
</body>
</html>

d.html
<html>
<body bgcolor="yellow">
</body>
</html>
20. Create a web page to display a table containing 2 rows and 2
columns which contains the names of your friends and each cell filled
with different background colors .

<html>
<head>
<tile>
creating a table with colors
</title>
</head>
<table border="2">
<tr>
<td bgcolor="red">Ramya</td>
<td bgcolor="green">Raju</td>
</tr>
<tr>
<td bgcolor="red">Venkat</td>
<td bgcolor="green">suma</td>
</tr>
</table>
</html>
21.Create a web page which asks for mode of payment which includes
the options: Credit card/Debit card/Online transfer (use radio buttons)

<html>
<head>
<title>
using Radio buttons
</title>
</head>
<body>
<form>
<input type="radio" name="button" value="creditcard">creditcard<br>
<input type="radio" name="button" value="Debitcard" >Debitcard<br>
<input type="radio" name="button"
value="onlineTransfer">OnlineTransfer<br>
</form>
</form>
</body>
</html>
22. Create a web page which asks the user to enter his credit card
details. Use textboxes, drop down buttons.
<html>
<head>
<title>
using forms
</title>
</head>
<body>
Enter credicard details
<p>
<form>
Name:
<input type="text">
<p>
Address:
<input type="text">
<p>
State:
<input type="text">
<p>
City:
<input type="text">
<p>
Pincode:
<input type="text">
<p>
Mode of Payment:
<select>
<option>credicard
<option>debitcard
</select>
<p>
Enter Card Number:
<input type="text">
<p>
Enter Cvv:
<input type="text">
<p>
<input type="submit" value="submit">
</form>
</body>
</html>
23. Create a web page to generate a purchase order as shown below:

<html>
<body>
<form>
<center>
Name:
<input type="text" ><p>
Address:
<input type="text" ><p>
state:
<input type="text" ><p>
City:
<input type="text" ><p>
Pincode:
<input type="text" ><p>
Magazine:
<select>
<option>computersToday
<option>Times
<option>D.c
</select>
<p>
Subscription:
<input type="radio" name="button"> 1 year
<input type="radio" name="button" >2 years <br>
<center>
<input type="submit" value= "Place Your Order">
</center>
</form>
</body>
</html>
24. Create a web page to display a hyperlink which when clicked
displays excel sheet containing student details .

<html>
<head>
<title>
creating hyperlinks
</title>
</head>
<body>
<a href="D:\Book1.xlsx">Book1</a>
</body>
</html>
25. Create a web page to display definition list which defines the terms:
B2B, B2C, C2B, C2C.

<html>
<head>
<title>
creating Definition Lists
</title>
</head>
<body>
<dl>
<dt>B2B</dt>
<dd>Business to Business<dd>
<dt>B2C</dt>
<dd>Business to commerce</dd>
<dt>C2B</dd>
<dd>Customer to Business</dd>
<dt>C2C</dt>
<dd>customer to customer</dd>
</dl>
</body>
</html>
26. Create a web page with paragraphs left, right and center aligned to
explain about various social networking sites. The paragraphs should be
on different colors and separated by horizontal lines of varying sizes.

<html>
<head>
<title>
creating paragraps
</title>
</head>
<body>
<h1>
<center>
Social NetWorking Sites:
</center>
</h1>
<br>
<h1 align="left" >
<hr color="red">
Facebook is a popular free social networking website that allows
registered users to create profiles, upload photos and video, send
messages and keep in touch with friends, family and colleagues.
<h2 align="right">
<hr color="green">
Twitter is an online news and social networking site where people
communicate in short messages called tweets.
<h3 align="center">
<hr color="blue">
Orkut was a social networking website owned and operated by Google.
The service was designed to help users meet new and old friends.
<hr color="yellow">
</body>
</html>
27. Create a web page to modify the default properties of h1 tag using
external style sheet.
<html>
<head>
<link rel="stylesheet" type="text/css" href="e.css">
</head>
</html>
e.css:
body {
background-color: lightblue;
}
h1
{
color: navy;
margin-left: 20px;
}
28. Create a web page to scroll the text “E-Commerce” for exactly 5
times from left to right of the screen.

<html>
<head>
<title>
scrollable text
</title>
</head>
<body>
<marquee behavior="scroll" direction="left" scrollamount="5">E-
commerce</marquee>
</body>
</html>
29.Create a web page to display the name of your college in h6 size with
blue as font color and background color yellow separated by a thick line
and below which a paragraph about the facilities offered by your college
is described .
<html>
<body bgcolor="yellow">
<h6>
<font color="blue">
Sree Venkateshwara Degree College of Commerce </font>
</h6>
<hr>
Facilities offered:
<p>
TechFest<br>
cultural programmes<br>
sports<br>
</body>
</html>
30. Create a web page with OSMANIA UNIVERSITY as the title and
five buttons labeled Home, About Us, Courses, ,feedback, Contact us as
shown in the diagram which when clicked displays the details on a
separate pages .

<html>
<head>
<title>
Osmania University
</title>
</head>
<body>
<h1>
<center>
OSMANIA UNIVERSITY
<h1>
<h6>
Telangana,Hyderabad
</h6>
</center>
</h1>
<form>
<center>
<input type="submit" value= "Home">
<input type="submit" value= "About Us">
<input type="submit" value= "Courses">
<input type="submit" value= "Feedback">
<input type="submit" value= "Contact Us">
</center>
</form>
</body>
</html>
31.Create a web page to demonstrate a pull-down menu. The menu
should contain the list of your favourite south Indian dishes.

<html>
<head>
creating pull down menus
</head>
<body>
<form>
<select>
<option>Idly
<option>Dosa
<option>Biriyani</select>
</form>
</body>
</html>
32. Create a web page with name of your college as text. The text should
scroll, alternate and slide.
<html>
<head>
<tilte>
marquee
</title>
</head>
<body>
<marquee behavior="slide" direction="left"> Sree Venkateshwara
Degree College of Commerce </marquee>
<marquee behavior="scroll" direction="left"> Sree Venkateshwara
Degree College of Commerce </marquee>
<marquee behavior="alternate"> Sree Venkateshwara Degree College of
Commerce </marquee>
<marquee behavior="scroll" direction="up"> Sree Venkateshwara
Degree College of Commerce </marquee>
</body>
</html>
33. Create a web page with 4 paragraphs of about 5 lines each describing
about E-Marketing, E- Shopping, E-banking and E-Learning. The
paragraphs should be aligned left, right, center and justified respectively.
<html>
<head>
<title>
creating paragraphs
</title>
</head>
<body>
<p align="left">
E-marketing:<br>
It is also called as web based marketing.<br>
Online marketing is the practice of leveraging web-based channels to
spread a message about a company's
<br>brand, products, or services to its potential customers. <br>
The methods and techniques used for online marketing include <br>
email, social media, display advertising, search engine optimization, and
more.
<p align="right">
E-shopping:<br>
Online shopping is a form of electronic commerce which allows
consumers <br>to directly buy goods or
services from a seller over the Internet using a web browser.<br>
Consumers find a product of interest by visiting the website of the
retailer directly <br>
or by searching among alternative vendors using a shopping search
engine,<br> which displays the same
product's availability and pricing at different e-retailers.
<p align="center">
E-banking:<br>
It is also called as on line banking.<br>
It is also refered as web based banking.<br>
we can also called as brick to click banks.<br>
A method of banking in which the customer conducts transactions
electronically via the Internet.<br>
funds transfers,account creations also possible.
<p align="justify">
E-learning:<br>
It is also called as web based learning.<br>
learning through online.<br>
e-learning activities are CBT&CBL.<br>
CBT means computer based learning.<br>
CBL mens computer based Training.<br>
</body>
</html>
34. Create a web page with name of your college as Text in h6 size, font
as verdana, blue as font color followed by a copyright symbol and
trademark symbol.

<html>
<body>
<h6>
<font color="blue" face="verdana">
sreenidi
</font>
</h6>
&trade;<br>
&copy;
</body>
</html>
35. Create a login page asking the user to enter his username and
password followed by a submit button.
<html>
<body>
Login<br>
<form>
UserName:
<input type="text" name="firstname"><br><br>
Password:
<input type="text" name="lastname"><br><br>
<input type="submit" value="submit">
</form>
</bdy>
</html>
36. Create a web page to create links to the sections on the same page.
<html>
<head>
<title>
creating links to the sections on the same page
</title>
</head>
<body>
<a href="#ref1">This is a reference to the bottom of this document</a>
<a name="ref1">text</a>
</body>
</html>
37. Create a web page using a form which collects data about students
rollno, name and marks in various subjects followed by submit and reset
buttons.
<html>
<head>
<title>
creating forms
</title>
</head>
<body>
Student Marks Details
<form>
Rollno:
<input type="text" name="RollNo"><br><br>
Name:
<input type="text" name="Name"><br><br>
Marks:
<input type="text" name="marks">
<select>
<option>IT
<option>MIS
<option>RDBMS
<option>C
<option>C++
<option>E-COMMERCE
</select>
<br>
<input type="Submit" value="submit">
<input type="Reset" value="Reset"><br>
</form>
</body>
</html>
38. Create a web page using a form titled as Feedback form which takes
the feedback of the various facilities offered in your college. The form
should have fields student name, rollno followed by 5 check boxes
labelled Excellent, Very Good, Good, Average, Bad respectively.

<html>
<head>
<title>
creating forms
</title>
</head>
<body>
<h1>
<center>
Sree Venkateshwara Degree College of Commerce
</center><br>
Feedback Form:
<p>
</h1>
Facilities Offered in College:
<br>
<ul>
<li>Mineral Drinking Water
<li>Play Ground
<li>Cantin
<li>Wifi
<li>Yoga
</ul>
<br>
Rollno:
<input type="text" name="RollNo"><br><br>
Name:
<input type="text" name="Name"><br><br>
<input type="checkbox" value="excellent" >Excellent<br>
<input type="checkbox" value="very good" >Very Good<br>
<input type="checkbox" value="good">Good<br>
<input type="checkbox" value="average">Average<br>
<input type="checkbox" value="bad">Bad<br>
</form>
</body>
</html>
39. Create a web page to display the list of universities available in
Telangana state using a pull- down menu.

<html>
<head>
<title>
creating pull down menus
</title>
</head>
<body>
<h1>
List of Universities in Telangana
</h1>
<br>
<form>
<select>
<option>Dr.B.R Ambedkar open University
<option>J.N.T.U
<option>Kakatiya University
<option>Mahatma Gandi University
<option>Palamuru University
<option>Osmania University
<option>Potti sreeramulu Telugu University
</select>
<form>
</body>
</html>
40. Create a web page to display an image surrounded by text on left and
right sides.

<html>
<head>
<title>
insert an image with some lines of text about image
</title>
</head>
<body>
<div align="right">
Penguins
</div>
<div align="left">
Penguins
</div>
<center>
<img src="C:\Users\Public\Pictures\Sample Pictures\Penguins.jpg">
</center>
</img>
</body>
</html>
41. Create a user registration form for an upcoming examination.(use
textboxes, pulldown menus, option boxes, submit button)

<html>
<head>
<title>
creating forms
</title>
</head>
<body>
<h1>
<center>
Exam Registration Form
</center>
</h1>
RollNo:
<input type="text" name="RollNo"><br><br>
Name:
<input type="text" name="Name"><br><br>
Course:
<input type="text" name="course">
<select>
<option>B.com I
<option>B.com II
<option>B.com III
</select><p>
Gender:
<input type="checkbox" value="Male" >Male
<input type="checkbox" value="Female" >Female<p>
Applying for exam:
<select>
<option>B.com I
<option>B.com II
<option>B.com III
</select>
<p>
subjects:
<select>
<option>RDBMS
<option>E-commerce
<option>GST
<option>Accounts
</select>
<p>
Fee:
<input type="text" name="fee">
<p>
<input type="submit" value="submit">
</form>
</body>
</html>
42. Create an web page to display a multilevel list taking your own
example.

<html>
<body>
<OL TYPE="1">
<LI>sports in Olympics
<OL TYPE="a">
<LI>tennis
<LI>hockey
<li>longjump
<li>boxing
<li>gun shooting
<li>swimmin
<li>high jump
<li>runnig race
</OL>
<LI>sports in olympics
<UL>
<LI>tennis
<LI>hockey
<li>longjump
<li>boxing
<li>gun shooting
<li>swimmin
<li>high jump
<li>runnig race
</OL>
</OL>
</body>
</html>
43. Create a table to demonstrate colspan, rowspan, cellspacing and cell
padding attributes of a table.

<html>
<head></head>
<body>
<table border=3 cellpadding=2 cellspacing=2 align=<center>
<caption><center> TIME TABLE</center></caption>
<tr>
<td>&nbsp;
<td>1<sup>st</sup>hour
<td>2<sup>nd</sup>hour
<td>3<sup>rd</sup>hour
<td>4<sup>th</sup>hour
<td rowspan=7>B<br>R<br>E<br>A<br>K
<td>5<sup>th</sup>hour
<td>6<sup>th</sup>hour
</tr>
<tr>
<td>MON
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
</tr>
<tr>
<td>TUE
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
</tr>
<tr>
<td>WED
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
</tr>
<tr>
<td>THR
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
</tr>
<tr>
<td>FRI
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
</tr>
<tr>
<td>SAT
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
<td>&nbsp;
</tr>
</table>
</body>
</html>
44. Create a webpage to insert an image using all the image attributes.
<html>
<head>
<title>
insert an image with some lines of text about image
</title>
</head>
<body>
<div align="right">
Penguins
</div>
<div align="left">
Penguins
</div>
<center>
<img src="C:\Users\Public\Pictures\Sample Pictures\Penguins.jpg"
height="350" width="350" alt="hello">
</center>
</img>
</body>
</html>
45. Create a web page using a default theme in front page to describe
about OSMANIA UNIVERSITY .
<html>
<body>
<h1>
<center>
<font color="Green">
Osmania University
</font>
</center>
</h1>
<p align="left">
Osmania University is a public state university located in University
Town,hyderabad,India,and founded in

1918 wit the help of ceif Architect of Mahbub Ali Khan-Nawab Sarwar
Jung.
<p>
It was establised by and named after te seventh and last Nizam of
Hyderabad,Mir Osman

AliKhan.Establised:1918.
</body>
<html>

You might also like