Scribd
Upload
23 views

1090 - Ecom Rec

The document provides examples of creating different types of web pages using HTML and CSS including pages that accept user input, display tables and lists, modify tag properties, and add images and hyperlinks. The examples cover basic features and formatting of web pages.

Uploaded by

21.094akhila
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
23 views

1090 - Ecom Rec

The document provides examples of creating different types of web pages using HTML and CSS including pages that accept user input, display tables and lists, modify tag properties, and add images and hyperlinks. The examples cover basic features and formatting of web pages.

Uploaded by

21.094akhila
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/ 72

1.

create a web page to display the following OUTPUT:: (use textboxes, submit button)

<!DOCTYPE html>

<html>

<body>

<form action="/action_page.php">

<center>Name: <input type="text" name="Name" value=""><br><br><br></center>

<center>Address: <input type="text" name="Address" value=""><br><br><br></center>

<center><input type="submit" value="Submit"></center><br><br>

</form>

</body>

</html>

OUTPUT::
2. create a web page to display the timetable of your class using tables

<!doctype html>

<html>
<head>
<style>
table, th, td {
border: 1px solid black;
}
</style>

<title>Timetable</title>

</head>

<body>
<h1> Time Table </h1>

<table width="80%" align="center” border=”3”>

<div id="head_nav">

<tr> <th>Time</th>

<th>Monday</th>

<th>Tuesday</th>

<th>Wednesday</th>

<th>Thrusday</th>

<th>Friday</th>

<th>Saturday</th>

</tr>

</div>

<tr>

<th>10:00 - 11:00</th>
<td>Applied Mathematics </td>

<td>Computer Networks</td>

<td>Information Theory and Coding</td>

<td>Computer Organization and Architecture</td>

<td>Automata Theory</td>

<td>Web Programming</td>

</div>

</tr>

<tr>

<th>11:00 - 12:00</th>

<td>Information Theory and Coding</td>

<td>Web Programming</td>

<td>Computer Networks</td>

<td>Computer Networks</td>

<td>Automata Theory</td>

<td>Applied Mathematics</td>

</div>

</tr>

<tr> <th>12:00 - 01:00</td>

<td>Applied Mathematics</th>

<td>Information Theory and Coding</td>

<td>Automata Theory</td>

<td>Computer Networks</td>

<td>Web Programming</td>
<td>Computer Networks</td>

</div>

</tr>

<tr>

<th>01:00 - 02:00</th>

<td>Applied Mathematics</td>

<td>Computer Organization and Architecture</td>

<td>Automata Theory</td>

<td>Web Programming</td>

<td>Information Theory and Coding</td>

<td>Computer Networks</td> </div>

</tr>

<tr>

<th>02:00 - 03:00</th>

<td>Applied Mathematics</td>

<td>Web Programming</td>

<td>Automata Theory</td>

<td>Computer Organization and Architecture</td>

<td>Information Theory and Coding</td>

<td>Computer Networks</td>

</div>
</tr>
</table>
</body>
</html>
OUTPUT::

3. create a web page which accepts user input as shown below .

<!DOCTYPE html>

<html>

<body>

<form action="/action_page.php">

<center>Name: <input type="text" name="Name" value=""><br><br><br></center>

<center>Address: <input type="text" name="Address" value=""><br><br><br></center>

<center>State: <input type="text" name="State" value=""><br><br><br></center>

<center>City: <input type="text" name="City" value=""><br><br><br></center>

<center>Pincode: <input type="text" name="Pincode" value=""><br><br><br></center>

<center><input type="submit" value="Place your Order"></center><br><br>

</form>

</body>
</html>

OUTPUT::

4. create a web page to modify the default properties of h1 tag using internal style sheet .

<!DOCTYPE html>

<html>

<head>

<style type="text/css">

#myid {border-width: 1; border: solid; text-align: center}

</style>

</head>

<body>

<H1 class="myclass"> This H1 is not affected </H1>

<H1 id="myid"> This H1 is affected by style </H1>

<H1> This H1 is not affected </H1>

</body>

</html>
OUTPUT::

5. create a web page to display an ordered list of courses in your college .

<!DOCTYPE html>

<html>

<body>

<h2>An ordered list for courses in My College</h2>

<ol>

<li>B.Com(Computers)</li>

<li>B.Com(General)</li>

<li>B.Com(Honors)</li>

<li>B.Sc(MECS)</li>

<li>B.Sc(MSCS)</li>

</ol>

</body>

</html>
OUTPUT::

6. create a web page to display a table with two rows and two columns . Also insert images in
the cells of the tables .

<html>

<center><head>Check It Down</head></center>

<body>

<table border = 5 bordercolor = red align = center>

<th colspan = 14>Book Table</th>

<tr>

<th colspan = 4>Book Name</th>

<th colspan = 4>Author</th>

<th colspan = 4>Picture</th>

</tr>

<tr>

<td colspan = 4>Java</th>

<td colspan = 4>Dietel and Dietel</th>

<td colspan = 4><img src="java.jpg" alt="" border=3 height=100 width=100></img></td>

</tr>
<tr>

<td colspan = 4>C Programming</td>

<td colspan = 4>BalaGuru Swamy</td>

<td colspan = 4><img src="cprg.jpg" alt="" border=3 height=100 width=100></img></td>

</tr>

</table>

</body>

<html>

OUTPUT::

7. create a web page to display a hyper link which when click direct you to amazon web sites

<!DOCTYPE html>

<html>

<body>

h2>Examp le for hyperlink to visit amazon.com on clicking</h2>

<a href="https://www.amazon.com" target="_blank">Click to Visit AMAZON!</a>

</body>

</html>
OUTPUT::

8. create a web page to demonstrate variences marquee over a given text

<!DOCTYPE html>

<html>

<head>

<title>Title of the document</title>

</head>

<body>

<marquee behavior="scroll" direction="up" loop="2">

<img src="sunset.jpg" width="190" alt="W3docs" /> </marquee>

<center><marquee behavior="scroll" direction="down">

<img src="sunset.jpg" width="190" height="45" alt="W3docs"/> </marquee></center>

<marquee direction="right">A scrolling text11 created with HTML Marquee


element.</marquee>

<marquee direction="left">A scrolling text11 created with HTML Marquee element.</marquee>

<marquee behavior="scroll" direction="down">A scrolling text created with HTML Marquee


element.</marquee>

</body>

</html>

OUTPUT::
9. create a web page to display the following OUTPUT: +
( take your own data into consideration )

<html>

<center><head>Check It Down</head></center>

<body>

<table border = 5 bordercolor = red align = center>

<tr>

<th colspan=2>Title</th>

</tr>

<tr>

<td>Avul Pakir Jainulabdeen Abdul Kalam (5 October 1931 – 27 July 2015)

was an aerospace scientist who served as the 11th President of India from 2002 to 2007.

He was born and raised in Rameswaram, Tamil Nadu and studied physics and aerospace engineering.

He spent the next four decades as a scientist and science administrator,


mainly at the Defence Research and Development Organisation (DRDO) and Indian Space Research

Organisation (ISRO) and was intimately involved in India's civilian space programme and military missile
development efforts.

He thus came to be known as the Missile Man of India for his work on the development of

ballistic missile and launch vehicle technology.He also played a pivotal organisational,

technical, and political role in India's Pokhran-II nuclear tests in 1998,

the first since the original nuclear test by India in 1974.

</td>

<td><img src="AbdulKalam.jpg" alt="" border=3 height=100 width=500></img></td>

</tr>

</table>

</body>

<html>

OUTPUT::

10. create a web page to display the following OUTPUT: : (a+b)2 a 2+2 ab+ b 2
H2SO4

<!DOCTYPE html>

<html>

<head>

<style>
sup {

vertical-align: super;

font-size: medium;

</style>

</head>

<body>

<p><h1>Example to demonstrate superscript text</h1></p>

<p>**************************************************************************</p>
<br><br>

<p>(a+b)<sup>2</sup>=a<sup>2</sup>+2ab+b<sup>2</sup></p><br><br>

<p><h1>Example to demonstrate subscript text</h1></p>

<p>**************************************************************************</
p><br><br>

<p>H<sub>2</sub>SO<sub>4</sub></p>

</body>

</html>

OUTPUT: :
11. Create a web page to demonstrate the usage of nested tables as shown in the diagrambelow:

<!DOCTYPE html>

<html>

<head>

<style>

table, th, td {

border: 3px solid black;

border-spacing :15px;

#table1{

border-collapse: collapse;

#table2{

border-collapse: collapse;

</style>

</head>
<body>

<center>

<table>

<tr>

<td>

<table id="table1">

<tr>

<td>Rubber</td>

<td>Baby</td>

</tr>

<tr>

<td>Buggy</td>

<td>Bumpers</td>

</tr>

</table>

</td>

<td>

<table id="table2">

<tr>

<td>She</td>

<td>sells</td>

</tr>

<tr>

<td>Sea</td>

<td>shells</td>
</tr>

</table>

</td>

</tr>

</table>

</center>

</body>

</html>

OUTPUT::

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

<!DOCTYPE html>

<html>

<head>

<style>

img {

float:left;

</style>
</head>

<body>

<div><center><img src="logo1.jpg" alt="logo"


style="width:500px;height:120px;margin-left:80px;"></div>

<div><center><p><font size=50 color="blue">R.G.KEDIA COLLEGE OF COMMERCE</font>

</p></div>

<p><center>No 3-1-336, Opp.Chaderghat New Bridge, Kachiguda Station Road,Esamia Bazar,


Hyderabad,

Telangana 500027</p>

<p>Phone: +91 40 24738708, 24738939.

Fax: +91 40-24738708

Email: [email protected]

</center></p>

</body>

</html>

OUTPUT: :

13. Create a web page to demonstrate definition lists by taking various applications of ecommerce
as an example.

<!DOCTYPE html>

<html>

<body>
<center><u><font size=20 color="blue">E-Commerce Applications</font></u></center>

<dl>

<dt><u>1.Retail & Wholesale</u></dt>

<dd>There are numerous applications for retail as well as wholesale in the case of e-commerce.

Here comes e-retailing or may be called as online retailing. This refers to the selling of

goods and other services through electronic stores from business to consumers.

These are designed and equipped using a shopping cart model and electronic catalog.</dd><br><br>

<dt><u>2.Marketing</u></dt>

<dd>Using web and e-commerce, data collection about the following are possible Preferences,

Behavior, Needs and Buying patterns. The marketing activities like price fixing,

product feature, and its enhancement, negotiation, and the relationship with the customer

can be made using these.</dd><br><br>

<dt><u>3.Finance </u> </dt>

<dd> eCommerce is being used by the financial companies to a large extent.

By the name finance, we know that there will be customers and transactions.

The customers can check the balance in their savings account, as well as their

loan account. There are features like transferring of money from and to their own accounts,

paying off bills online and also e-banking. Online stock trading is also another feature

of e-commerce. </dd><br><br>

<dt> <u>4.Manufacturing </u></dt>

<dd> eCommerce is included and used in the chain operations (supply) of a company.

There are companies that form the electronic exchange.

This is by providing buying and selling items together, trading market information and the

information of runback office like inventory control. This is a way that speeds up the
flow of finished goods and the raw materials among the business community members. </dd><br><br>

<dt> <u>5.Auctions</u> </dt>

<dd> eCommerce customer to customer is direct selling of goods among customers.

It includes electronic auctions that involve bidding system.

Bidding allows prospective buyers to bid an item.

In Airline Company they give bidding opportunity for customers to quote the price for

a seat on a specific route, date and time. </dd><br><br>

<dt><u> 6.Entertainment </u></dt>

<dd> eCommerce application is widely used in entertainment area

also for video cataloging, multiplayer games, interactive ads and for online discussion. </dd><br><br>

<dt><u> 7.Education </u></dt>

<dd> In educational training also e-commerce has a major role in interactive education,

video conferencing, online class and for connecting different educational training
centers.</dd><br><br>

</dl>

</body>

</html>

OUTPUT: :

14. Create a web page to display a bulleted list of subjects available in the current semester.
<!DOCTYPE html>

<html>

<body>

<center><h1><u>B.Com Computers-VI Sem Subject list</u></h1></center>

<ul type="circle">

<li>Regulation of Insurance Business</li>

<li>Managerial Accounting</li>

<li>Company Law</li>

<li>Financial Institutions & Markets</li>

<li>Commerce Lab</li>

<li>E-Commerce</li>

<li>Relational Database Management Systems</li>

</ul>

<p> There can be 4 types of bulleted list:<br>

1.disc<br>

2.circle<br>

3.square<br>

4.none<br>

raining also e-commerce has a major role in interactive education,


video conferencing, online class and for connecting different educational training
centers.</dd><br><br>
</dl>
</body>
</html>

</p>
</body>

</html>

OUTPUT: :

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 behavior="scroll" direction="left">

<img src="logo.jpg" alt="logo1.jpg">

</marquee>

</body>
</html>

OUTPUT::

16. Create a web page to display a button which when clicked directs you to your college website.

<!DOCTYPE html>

<html>

<head>

<body>

<h4><u> Example of A Button Which Acts Like A Link</u></h4>

<form action="http://www.rgkediacollege.com/">

<input type="submit" value="Visit KEDIA" />

</form>

</body>

</html>

OUTPUT: :

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.
<!DOCTYPE html>

<html>

<body>

<center><h1><u>Courses offered in R.G.Kedia College of Commerce</u></h1></center>

<center><h1>B.Com Computers</h1></center>

<hr size="2" color="blue">

<center><h1>B.Com Honours</h1></center>

<center><h1>B.Com Generals</h1></center>

<hr size="6" color="pink">

<center><h1>B.B.A</h1></center>

<hr size="8" color="Maroon">

<center><h1>B.S.C(MECS & MSCS)</h1></center>

<hr size="10" color="Lavender">

</body>

</html>

OUTPUT: :
18. Create a web page to display four horizontal frames each frame containing a different color.

<!DOCTYPE html>

<html>

<frameset rows="25%,25%,25%,25%">

<frame src="frame1.html">

<frame src="frame2.html">

<frame src="frame3.html">

<frame src="frame4.html">

</frameset>

</html>

OUTPUT::
19. Create a web page to display four vertical frames each frame containing a different color.

<!DOCTYPE html>

<html>

<frameset cols="25%,25%,25%,25%">

<frame src="frame1.html">

<frame src="frame2.html">

<frame src="frame3.html">

<frame src="frame4.html">

</frameset>

</html>
OUTPUT::

20. Create a web page to display a button with label “search” adjacent to a text box. Also change the
color of text box and background of the web page .

<!DOCTYPE html>

<html>

<body>

<center><u><font size="20" color="Blue">Let's Search and get It</font></u></center>

<br><br><br><br><br><br><br><br><br>

<center><input id="txt" type="text" name="Search" value="" size="35">

<button type="button" onclick="myFunction()">Search</button></center>

<script>

function myFunction() {

document.body.style.background = "Lightgreen";

document.getElementById("txt").style.background = "cyan";

</script>

</body>

</html>

OUTPUT: :
21. 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 .

<!DOCTYPE html>

<html>

<head>

<style>

table, th, td {

border: 1px solid black;

</style>

</head>

<body>

<center>

<h1><u>Table cells with different colors</u></h1>

<table>

<tr>

<tr>

<td style="background-color:green">SSSSS</td>

<td style="background-color:Yellow">PPPPP</td>

</tr>
<tr>

<td style="background-color:Pink">RRRRR</td>

<td style="background-color:Cyan">KKKKK</td>

</tr>

</table>

</center>

</body>

</html>

OUTPUT: :

22. Create a web page to demonstrate the usage of rowspan and colspan for the figure below:

<!DOCTYPE html>
<html>

<head>

<style>

table, th, td {

border: 1px solid black;

</style>

</head>

<body>

<center>

<h1><u>Demo on rowspan and colspan</u></h1>

<table>

<tr>

<th colspan="3" style="text-align:center">Top</th>

</tr>

<tr>

<td rowspan="2">Middle Left</td>

<td>Middle Up</td>

<td rowspan="2">Middle Right</td>

</tr>

<tr>

<td>Middle Down</td>

</tr>

<tr>

<th colspan="3" style="text-align:center">Down</th>


</tr>

</table>

</body>

</html>

OUTPUT::

23. Create a web page which asks for mode of payment which includes the options: Credit card/Debit
card/Online transfer (use radio buttons) .

<!DOCTYPE html>

<html>

<body>
<h2><u>Mode of payment</u></h2>

<form>

<input type="radio" name="cc" value="male" checked> Credit card<br>

<input type="radio" name="dc" value="female"> Debit card<br>

<input type="radio" name="ot" value="other"> Online Transfer<br>

</form>

</body>

</html>

OUTPUT::

24. Create a web page which asks the user to enter his credit card details. Use textboxes, drop down
buttons .

<html>

<body>

<form class="credit-card">

<div class="form-header">

<h4 class="title">Credit card detail</h4>

</div>

<div class="form-body">
<!-- Card Number -->

<input type="text" class="card-number" placeholder="Card Number">

<!-- Date Field -->

<div class="date-field">

<div class="month">

<select name="Month">

<option value="january">January</option>

<option value="february">February</option>

<option value="march">March</option>

<option value="april">April</option>

<option value="may">May</option>

<option value="june">June</option>

<option value="july">July</option>

<option value="august">August</option>

<option value="september">September</option>

<option value="october">October</option>

<option value="november">November</option>

<option value="december">December</option>

</select>

</div>

<div class="year">

<select name="Year">

<option value="2016">2016</option>

<option value="2017">2017</option>
<option value="2018">2018</option>

<option value="2019">2019</option>

<option value="2020">2020</option>

<option value="2021">2021</option>

<option value="2022">2022</option>

<option value="2023">2023</option>

<option value="2024">2024</option>

</select>

</div>

</div>

<!-- Card Verification Field -->

<div class="card-verification">

<div class="cvv-input">

<input type="text" placeholder="CVV">

</div>

<div class="cvv-details">

<p>3 or 4 digits usually found <br> on the signature strip</p>

</div>

</div>

<!-- Buttons -->

<button type="submit" class="proceed-btn"><a href="#">Proceed</a></button>

<button type="submit" class="paypal-btn"><a href="#">Pay With</a></button>

</div>

</form>
</body>

</html>

OUTPUT::

25. Create a web page to generate a purchase order as shown below:

<html>

<body>

<form class="order form">

<div class="form-header">

<h4 class="title">Magazine Purchase order </h4>

</div>

<div class="form-body">

<!-- Card Number -->


Name: <input type="text" class="order form" placeholder="Name"><br><br>

Address: <input type="textarea" class="order form" placeholder="Address"><br><br>

State: <input type="text" class="order form" placeholder="State"><br><br>

City: <input type="text" class="order form" placeholder="City"><br><br>

PinCode: <input type="text" class="order form" placeholder="PinCode"><br><br>

<!-- Magazine -->

<div class="MagazineF">

<div class="MagName">

<select name="Magazine Name">

<option value="Computers Today">Computers Today</option>

<option value="E-Commerce">E-Commerce</option>

<option value="Artificial Intelligence">Artificial Intelligence</option>

<option value="NetworKing">Networ'King'</option>

<option value="BigData">BigData</option>

</select>

</div>

<!-- Buttons -->

Subscription: <input type="radio" name="sc1" value="1 year" > 1 Year

<input type="radio" name="sc2" value="2 years" checked> 2 Years<br>

<button type="submit" class="Place Order"><a href="#">Place Your Order</a></button>

</div>

</form>

</body>

</html>

OUTPUT::
28. . 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.

<!DOCTYPE html>

<html>

<body>

<br><br>

<center><u><h1>Social Networking Sites</h1></u></center>

<hr size="6" color="Green">

<center><u><h2>[Right Aligned Paragraph]</h2></u></center>

<p align="right" style="color:blue"><u><b>1 – Facebook</b></u>

fb

This is easily the largest social networking site in the world and one of the most widely used.

And, Facebook was perhaps the first that surpassed the landmark of 1 billion user accounts.

Apart from the ability to network with friends and relatives, you can also access different

Facebook apps to sell online and you can even market or promote your business, brand and

products by using paid Facebook ads.


Recently Facebook has lost the trust of millions of its users by allowing 3rd parties

to access over 87 million users’ personal data. This is a massive breech of trust and has

created a feeling of unrest amongst the social media platform’s audience. So much so that

there is now a #deletefacebook campaign where people are completely removing themselves from

Facebook and using other networks instead. If you’re concerned about what Facebook is doing

with your data, then why not check out my guide on alternatives to Facebook, and see if there’s

a better place for you to interact with family and friends.

Number of active users per month: 1.59 billion approximately</p>

<hr size="6" color="Green">

<center><u><h2>[Left Aligned Paragraph]</h2></u></center>

<p align="left" style="color:red"><u><b>2 – WhatsApp</b></u>

WhatsApp

Despite having been acquired by Facebook in 2014, this instant messaging platform

exists as an independent entity.

It arrived on the scene much later than Facebook, but has been able to capture the

imagination of millions of people across the world by giving them the ability to

communicate and share instantly with individuals and groups. The WhatsApp call feature

is just the icing on the cake!

Number of active users per month: 1 billion approximately</p>

<hr size="6" color="Green">

<center><u><h2>[Center Aligned Paragraph]</h2></u></center>

<p align="center" style="color:Purple"><u><b>3 – WeChat</b></u>

wechat

This is an all-in-one communications app for messaging and calling (similar to WhatsApp)
that enables you to connect with the people of your choice. It was also developed by Tencent

in China and can easily work alongside QQ. As per the BI intelligence report, the number of

WeChat users are fast catching up with the number of WhatsApp users.

Related article: WeChat keyboard shortcuts

Number of active users per month: 697 million approximately</p>

<hr size="6" color="Green">

<center><u><h2>[Justified Paragraph]</h2></u></center>

<p align="justify" style="color:Maroon"><u><b>4 – Instagram</b></u>

instagram

Instagram was launched as a unique social networking platform that was completely based on

sharing photos and videos. This photo sharing social networking app thus enables you to

capture the best moments of your life, with your phone’s camera or any other camera, and

convert them into works of art.

This is possible because Instagram allows you to apply multiple filters to your photos

and you can easily post them to other popular social networking sites, such as Facebook

and Twitter. It is now part of the Facebook empire. Learn how to grow your Instagram audience.

Read more on Instagram Tools to help you increase social engagement and audience numbers.

Number of active users per month: 400 million approximately</p>

<hr size="6" color="Green">

</body>

</html>
OUTPUT::

29. Create a web page which displays four buttons containing text B2B, B2C, C2B, C2C. Also when a
button is clicked details about the clicked subject should appear on a separate page.

<!DOCTYPE html>

<html>

<body>

<center><p><h3>E-commerce business models can generally be categorized

into the following categories.<h3>

<h3>Business - to - Business (B2B)</h3>

<h3>Business - to - Consumer (B2C)</h3>

<h3>Consumer - to - Consumer (C2C)</h3>

<h3>Consumer - to - Business (C2B)</h3>

</p></center>
<h2> Click the respective button to know more!!!</h2>

<button onclick="window.location.href = 'frame1.html';">B2B</button>

<button onclick="window.location.href = 'frame2.html';">B2C</button>

<button onclick="window.location.href = 'frame3.html';">C2B</button>

<button onclick="window.location.href = 'frame4.html';">C2C</button>

</body>

</html>

Frame1.html

<html>

<body bgcolor="green">

<h1>

Business - to - Business</h1>

A website following the B2B business model sells its products to an

intermediate buyer who then sells the product to the final customer.

As an example, a wholesaler places an order from a company's website

and after receiving the consignment, sells the endproduct to the final

customer who comes to buy the product at one of its retail outlets.

</body>

</html>

frame2.html

<html>
<body bgcolor="blue">

<h1>Business - to - Consumer</h1>

A website following the B2C business model

sells its products directly to a customer. A customer can view the

products shown on the website. The customer can choose a product and

order the same. The website will then send a notification to the business

organization via email and the organization will dispatch the product/goods

to the customer.

</body>

</html>

Frame3.html

<html>

<body bgcolor="yellow">

<h1>Consumer - to - Consumer</h1>

A website following the C2C business model helps consumers to sell

their assets like residential property, cars, motorcycles, etc.,

or rent a room by publishing their information on the website. Website

may or may not charge the consumer for its services. Another consumer may

opt to buy the product of the first customer by viewing the

post/advertisement on the website.

</body>

</html>
Frame4.html

<html>

<body bgcolor="purple">

<h1>Consumer - to - Business</h1>

In this model, a consumer approaches a website showing multiple

business organizations for a particular service. The consumer places an

estimate of amount he/she wants to spend for a particular service.

For example, the comparison of interest rates of personal loan/car loan

provided by various banks via websites. A business organization who

fulfills the consumer's requirement within the specified budget, approaches

the customer and provides its services.

</body>

</html>

OUTPUT::
30. Create a web page to modify the default properties of h1 tag using external style sheet.

<!DOCTYPE html>

<html>

<head>

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

</head>

<body>

<center><h2><u>

Demonstration of H1 tag default properties in external style sheet

</u></h2></center>

<h1>This is a heading</h1>

<p>This is a paragraph.</p>

</body>

</html>

mystyle.css

h1 {

display: block;

font-size: 2em;

margin-top: 0.67em;

margin-bottom: 0.67em;

margin-left: 0;

margin-right: 0;

font-weight: bold;

color: navy;

margin-left: 20px;
}

OUTPUT::

31. Create a web page to scroll the text “E-Commerce” for exactly 5 times from left to right of the
screen.

<!DOCTYPE html>

<html>

</head>

<body>

<marquee direction = "right" loop = "5" width = "100%"><h2


class="city1">E-Commerce</h2></marquee>

</body>

</html>

OUTPUT::

33. 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.

<!DOCTYPE html>

<html>
<style>

h6{

background-color:yellow;

color:green;

</style>

<body>

<center><h6>R.G.Kedia College of Commerce</h6></center><br>

<hr size="4" color="green">

<font size="4"> Good Faculty</font><br>

<font size="4"> Well Equipped Labs</font><br>

<font size="4"> Clean and Green Campus</font><br>

<font size="4"> Management with clear vision</font><br>

<font size="4"> Digital class rooms</font><br>

<font size="4"> Auditorium</font><br>

<font size="4"> Conference Hall</font><br>

</body>

</html>

OUTPUT::
35. Create a web page to demonstrate a pull-down menu. The menu should contain the list of your
favourite south Indian dishes.

<!DOCTYPE html>

<html>

<head>

<title>Select Box Control</title>

</head>

<body>

<p>Here's the list of subjects. Select any one:</p>

<form>

<select name = "dropdown">

<option value = "Computer Architecture" selected>Computer Architecture</option>

<option value = "Java">Java</option>

<option value = "Discrete Mathematics">Discrete Mathematics</option>

</select>

</form>

</body>

</html>

OUTPUT::

36. Create a web page with name of your college as text. The text should scroll, alternate and slide.

<!DOCTYPE html>
<html>

<head>

<title>TEXT CONTROL</title>

</head>

<body>

<marquee bgcolor="#000080" style="color: #FFFFFF; font-family: Book Antiqua"

behavior="scroll" >

R.G.KEDIA COLLEGE OF COMMERCE (Behavior : Scroll)</marquee><br><br><br><br>

<marquee bgcolor="#000080" style="color: #FFFFFF; font-family: Book Antiqua" behavior="slide">

R.G.KEDIA COLLEGE OF COMMERCE (Behavior : Slide)</marquee><br><br><br><br>

<marquee bgcolor="#000080" style="color: #FFFFFF; font-family: Book Antiqua" behavior="alternate" >

R.G.KEDIA COLLEGE OF COMMERCE (Behavior : Alternate)</marquee><br><br><br><br>

</body>

</html>

OUTPUT::

39. 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.

<!DOCTYPE html>

<html>

<body>

<center><u><font size="4" color="green">college name with the verdana font,


in color blue and with copyright and trade marks</font></u></center>

<center><h6><font face="verdana" color="blue">R.G.Kedia College of


Commerce©™</font></h6></center><br>

</body>

</html>

OUTPUT::

40. Create a login page asking the user to enter his username and password followed by a submit
button.

<!DOCTYPE html>

<html>

<body>

<center>

<h4><font color="blue"><u> Login Form </u><font></h4>

<label for="usrname">Username</label>

<input type="text" id="usrname" name="usrname"><br><br>

<label for="psw">Password</label>

<input type="password" id="psw" name="psw"><br><br>

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

</body>

</html>

OUTPUT::
41. Create a web page to create links to the sections on the same page.

<!DOCTYPE html>

<html>

<body>

<p><b>John</b><br>

<a href="#personal_life">Personal Life</a><br>

<a href="#occupation">Occupation</a><br>

<a href="#discoveries">Discoveries</a><br><br>

<p>Let's create one ourselves.

<p>

<b>John Wilscot</b>

<p><a name="personal_life"><b>Personal Life</b></a><br>

John Wilscot was born in Fort Lauderdale, Florida. He grew up with three other siblings,

two brothers and one sister.

His father was a dentist and had his own clinic while his mother was a Head nurse.

<p>From an early age, John showed a talent for sciences and mathematics.

While attending school, the teachers saw his

astute ability to perform advanced mathematics in very specialized fields.

John Wilscot was born in Fort Lauderdale, Florida. He grew up with three other siblings,

two brothers and one sister.


His father was a dentist and had his own clinic while his mother was a Head nurse.

<p>From an early age, John showed a talent for sciences and mathematics.

While attending school, the teachers saw his

astute ability to perform advanced mathematics in very specialized fields.

John Wilscot was born in Fort Lauderdale, Florida. He grew up with three other siblings,

two brothers and one sister.

His father was a dentist and had his own clinic while his mother was a Head nurse.

<p>From an early age, John showed a talent for sciences and mathematics.

While attending school, the teachers saw his

astute ability to perform advanced mathematics in very specialized fields.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.
It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.
It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

<p><a name="occupation"><b>Occupation</b></a><br>

Using his strong abilities in science and mathematics, John pursued a career in

chemistry and became a chemist.

He started out in the company in 1994 and took a role as an assistant researcher.

He worked under the head researcher

for three years before he moved up in the role as senior researcher.

Using his strong abilities in science and mathematics, John pursued a career in

chemistry and became a chemist.

He started out in the company in 1994 and took a role as an assistant researcher.

He worked under the head researcher


for three years before he moved up in the role as senior researcher.

Using his strong abilities in science and mathematics, John pursued a career in

chemistry and became a chemist.

He started out in the company in 1994 and took a role as an assistant researcher.

He worked under the head researcher

for three years before he moved up in the role as senior researcher.

Using his strong abilities in science and mathematics, John pursued a career in

chemistry and became a chemist.

He started out in the company in 1994 and took a role as an assistant researcher.

He worked under the head researcher

for three years before he moved up in the role as senior researcher.

Using his strong abilities in science and mathematics, John pursued a career in

chemistry and became a chemist.

He started out in the company in 1994 and took a role as an assistant researcher.

He worked under the head researcher

for three years before he moved up in the role as senior researcher.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into


the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into


the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

<p><a name="discoveries"><b>Discoveries</b></a><br>

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.
It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

It was during this time as senior researcher that John made his most crucial discovery

that put him on the hall of fame.

John discovered a chemical solution that was able to purify the earth's atmosphere.

It was a solution that sprayed into

the air was able to dissolve and cleanse any smog that was in the atmosphere.

</body>

</html>

OUTPUT::
42. Create a web page using a form which collects data about students roll no , name and marks in
various subjects followed by submit and reset buttons.

<!DOCTYPE html>

<html>

<body>

<form action="/action_page.php">

<center>

<h4><u><font size="4" color="blue">Student Academic Information form</font></u></h4><br>

Stud.ID : <input type="text" name="RNO"><br><br>

St.Name : <input type="text" name="Name"><br><br>

English : <input type="text" name="English"><br><br>

G.S.T : <input type="text" name="GST"><br><br>

Mng.Eco : <input type="text" name="M E"><br><br>

E-comm : <input type="text" name="E-commerce"><br><br>

RDBMS : <input type="text" name="RDBMS"><br><br>

Accounting : <input type="text" name="Accounting"><br><br>

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

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

</center>

</form>

<p>Note:Click on the reset button to reset the form.</p>

</body>

</html>

OUTPUT::
44. Create a web page to display the list of universities available in Telangana state using a pulldown
menu.

<!DOCTYPE html>

<html>

<head>

<title>Universities in Telangana</title>

</head>

<body>

<center>

<p><u><font color="Blue" size="3">Universities in Telangana</font></u></p>

<form>

<select name = "dropdown">

<option value = "Central Institute of Tool Design" selected>Central Institute of

Tool Design</option>

<option value = "Dr. B.R.Ambedkar Open University">Dr. B.R.Ambedkar Open University</option>


<option value = "Jawaharlal Nehru Architecture and Fine Arts University">Jawaharlal Nehru Architecture
and Fine Arts University</option>

<option value = "Jawaharlal Nehru Technological University">Jawaharlal Nehru Technological


University</option>

<option value = "Kakatiya University">Kakatiya University</option>

<option value = "Kaloji Narayan Rao University of Health Sciences">Kaloji Narayan Rao University of
Health Sciences</option>

<option value = "Mahatma Gandhi University">Mahatma Gandhi University </option>

<option value = "National Academy of Legal Studies & Research University">National Academy of Legal
Studies & Research University</option>

<option value = "Nizam's Institute of Medical Sciences">Nizam's Institute of Medical Sciences</option>

<option value = "Osmania University">Osmania University</option>

<option value = "Palamuru University">Palamuru University </option>

<option value = "Potti Sreeramulu Teugu Universtity">Potti Sreeramulu Teugu Universtity</option>

<option value = "Professor Jayashankar Telangana State Agricultural

University">Professor Jayashankar Telangana State Agricultural

University</option>

<option value = "Rajiv Gandhi University of Knowledge Technology">Rajiv Gandhi University of


Knowledge Technology</option>

<option value = "Satavahana University">Satavahana University</option>

<option value = "Sri Konda Laxman Telangana State Horticultural University">Sri Konda Laxman
Telangana State Horticultural University</option>

<option value = "Telangana University">Telangana University</option>

</select>

</form>

</center>

</body>

</html>
OUTPUT::

45. Create a web page to display an image surrounded by text on left and right sides.

<html>

<body>

<h2>Text on left and right side of the image</h2>

<p>This is some text on left side <img src="logo.jpg"

alt="logo1" width="100" height="100" align="middle"> This is some text on right side</p>

</body>

</html>

OUTPUT::

47. Create a user registration form for an upcoming examination.(use textboxes, pulldown menus,
option boxes, submit button)

<html>

<head>
<script type="text/javascript" src="FormValidation.js"></script>

</head>

<body>

<form action="#" name="StudentRegistration" onsubmit="return(validate());">

<table cellpadding="2" width="20%" bgcolor="99FFFF" align="center"

cellspacing="2">

<tr>

<td colspan=2>

<center><font size=4><b>Student Registration Form</b></font></center>

</td>

</tr>

<tr>

<td>Name</td>

<td><input type=text name=textname id="textname" size="30"></td>

</tr>

<tr>

<td>Father Name</td>

<td><input type="text" name="fathername" id="fathername"

size="30"></td>

</tr>

<tr>

<td>Postal Address</td>

<td><input type="text" name="paddress" id="paddress" size="30"></td>

</tr>

<tr>
<td>Personal Address</td>

<td><input type="text" name="personaladdress"

id="personaladdress" size="30"></td>

</tr>

<tr>

<td>Sex</td>

<td><input type="radio" name="sex" value="male" size="10">Male

<input type="radio" name="sex" value="Female" size="10">Female</td>

</tr>

<tr>

<td>City</td>

<td><select name="City">

<option value="-1" selected>select..</option>

<option value="New Delhi">NEW DELHI</option>

<option value="Mumbai">MUMBAI</option>

<option value="Goa">GOA</option>

<option value="Patna">PATNA</option>

</select></td>

</tr>

<tr>

<td>Course</td>

<td><select name="Course">

<option value="-1" selected>select..</option>

<option value="B.Tech">B.TECH</option>

<option value="MCA">MCA</option>
<option value="MBA">MBA</option>

<option value="BCA">BCA</option>

</select></td>

</tr>

<tr>

<td>District</td>

<td><select name="District">

<option value="-1" selected>select..</option>

<option value="Nalanda">NALANDA</option>

<option value="UP">UP</option>

<option value="Goa">GOA</option>

<option value="Patna">PATNA</option>

</select></td>

</tr>

<tr>

<td>State</td>

<td><select Name="State">

<option value="-1" selected>select..</option>

<option value="New Delhi">NEW DELHI</option>

<option value="Mumbai">MUMBAI</option>

<option value="Goa">GOA</option>

<option value="Bihar">BIHAR</option>

</select></td>

</tr>

<tr>
<td>PinCode</td>

<td><input type="text" name="pincode" id="pincode" size="30"></td>

</tr>

<tr>

<td>EmailId</td>

<td><input type="text" name="emailid" id="emailid" size="30"></td>

</tr>

<tr>

<td>DOB</td>

<td><input type="text" name="dob" id="dob" size="30"></td>

</tr>

<tr>

<td>MobileNo</td>

<td><input type="text" name="mobileno" id="mobileno" size="30"></td>

</tr>

<tr>

<td><input type="reset"></td>

<td colspan="2"><input type="submit" value="Submit Form" /></td>

</tr>

</table>

</form>

</body>
</html>

OUTPUT::
48. Create an web page to display a multilevel list taking your own example.

<html>

<body>

<h2>A Multilevel List</h2>

<p>List can be nested (lists inside lists):</p>

<ul>

<li>Coffee</li>

<li>Tea

<ul>

<li>Black tea</li>

<li>Green tea</li>

<li>Lemon tea</li>

<li>Ginger tea</li>

</ul>

</li>

<li>Milk</li>

</ul>

</body>

</html>

OUTPUT::
49. Create a table to demonstrate colspan, rowspan, cellspacing and cell padding attributes of a table

<!DOCTYPE html>

<html>

<head>

<title>HTML Table Attributes</title>

</head>

<body>

<h4><u>table cellpadding,cellspacing attributes</u<</h4>

<table border = "1" cellpadding = "5" cellspacing = "5">

<tr>

<th>Name</th>

<th>Salary</th>

</tr>

<tr>
<td>Ramesh Raman</td>

<td>5000</td>

</tr>

<tr>

<td>Shabbir Hussein</td>

<td>7000</td>

</tr>

</table>

<h4><u>table colspan,rowspan attributes</u<</h4>

<table border = "1">

<tr>

<th>Column 1</th>

<th>Column 2</th>

<th>Column 3</th>

</tr>

<tr>

<td rowspan = "2">Row 1 Cell 1</td>

<td>Row 1 Cell 2</td>

<td>Row 1 Cell 3</td>

</tr>

<tr>

<td>Row 2 Cell 2</td>

<td>Row 2 Cell 3</td>

</tr>

<tr>
<td colspan = "3">Row 3 Cell 1</td>

</tr>

</table>

<h4><u>table border color ,bgcolor attributes</u<</h4>

<table border = "1" bordercolor = "green" bgcolor = "yellow">

<tr>

<th>Column 1</th>

<th>Column 2</th>

<th>Column 3</th>

</tr>

<tr>

<td rowspan = "2">Row 1 Cell 1</td>

<td>Row 1 Cell 2</td>

<td>Row 1 Cell 3</td>

</tr>

<tr>

<td>Row 2 Cell 2</td>

<td>Row 2 Cell 3</td>

</tr>

<tr>

<td colspan = "3">Row 3 Cell 1</td>

</tr>

</table>

</body>

</html>
OUTPUT:
50. Create a webpage to insert an image using all the image attributes

<!DOCTYPE html>

<html>

<head>

<title>Using Image in Webpage</title>

</head>

<body>

<p>Simple Image Insert</p>

<img src = "logo.jpg" alt = "Test Image" border = "4"

width = "150" height = "100" align = "center"/>


</body>

</html>

OUTPUT:

You might also like