Bike Showrooms in NDL: Sri Ramakrishna Degree (Autonomous) College
Bike Showrooms in NDL: Sri Ramakrishna Degree (Autonomous) College
ABSTRACT
ABSTRACT
A motorcycle often called a bike, motorbike, or cycle is a two or three-wheeled motor vehicle.
Motorcycle design varies greatly to suit a range of different purposes: long
distance travel, commuting, cruising, sport including racing, and off-road riding. Motorcycling is
riding a motorcycle and related social activity such as joining a motorcycle cluband
attending motorcycle rallies.
In 1894, Hildebrand & Wolfmüller became the first series production motorcycle, and the first to
be called a motorcycle. In 2014, the three top motorcycle producers globally by volume
were Honda, Yamaha (both from Japan), and Hero MotoCorp (India). In developing countries,
motorcycles are overwhelmingly utilitarian due to lower prices and greater fuel economy. Of all
the motorcycles in the world, 58% are in the Asia-Pacific and Southern and Eastern Asia regions,
excluding car-centric Japan.
According to the United States Department of Transportation the number of fatalities per vehicle
mile traveled was 37 times higher for motorcycles than for cars.A showroom is a large space
used to display products for sale, such as automobiles, furniture, appliances, carpet or apparel. It
is a retail store of a company in which products are on sale in a space created by their brand or
company. A showroom can also be a space for wholesale buyers to view fashion merchandise for
sale in their retail stores.
One of the world's largest showrooms is the 35,000 square metres (380,000 sq ft) BMW
showroom in Abu Dhabi. The biggest collection of showrooms is a 216,000-square-metre
(2,330,000 sq ft) car showroom in Istanbul called Autopia Europia.
The above details in the HTML project do by using the below tags. They are first one is starting
tag that is <html> to enter in the project work. Next by using the <head> </head> to heading on
the project work that is environmental pollution. And next enter in the body by using <body>
enter the details about the project work. To create a table by dividing the environmental pollution
types by using the <td> ,<tr>. To improve project output we are using hyper links (<a>,</a>) and
frames (<frame>).
REQUIREMENT
ANALYSIS
REQUIREMENT ANALYSIS
SOFTWARE
SPECIFICATIONS
SOFTWARE SPECIFICATIONS
ABOUT HTML
HTML stands for Hyper Text Markup Language. It is to design or create web pages that are to be
published on the web. The basic principle in using HTML is to use the mixture of text and
images and applying formatting to it. The web browser uses that formatting information to
process the content. HTML has its own syntax and semantic rules.
HTML Tags
Any formatted text document is composed of a set of elements such as paragraphs, heading and
lists. In html formatting is specified by using tags.
The following are the points should be noted about HTML tags
1) Tags are delimited by angle brackets: <body>
2) They are not case sensitive Ex: <head>, < HEAD>, < Head> all are same.
3) Styles must be switched off by an end tag However, a few tags does not require
corresponding closing tags.
4) White spaces, tabs, and newlines are ignored by the browser. Multiple white spaces are
replaced by a single space and newlines, abs are treated as spaces.
5) If a tag was not understood by a browser, usually it will be ignored.
In every HTML document <HTML> and </HTML> tags marks the beginning and the end of the
document. These tags inform the browser the document is an HTML file. All other HTML tags
reside within he <HTML>.......</HTML> tags.
The HTML document can be divided into two sections
Header or Head section
Body section
Head section
HTML includes a pair tags,< HEAD> and </HEAD> to identify the heading of title of a
document. The tag< TITLE>.....</TITILE > can appear only in this section. The text that exists
between the title tags appears title in the browser's window and length of it should not exceed
beyond 60 characters
Body Section
The body of an HTML document contains the text that wins show up on the web page. The body
section is enclosed within <BODY> and <BODY> tags. It gives a descriptive of the document's
layout and structure.
HTML files include both control information (HIMI, tags) and content (text) which together
describe the appearance and contents of web pages. ln addition each of these tags can have their
own settings called attributes.
The following features should be kept in mind while writing HTML documents
1) Each tag is enclosed within with in a’<’ and ‘>’. These special characters are what
differentiate the tags from ordinary text.
2) Opening tag is denoted by <>, example< HEAD>
3) Closing tag is denoted by</>, for example</ HEAD>
4) The names are not case sensitive but generally they are written in uppercase so as to
distinguish them from the normal text.
A good practise to use comments is to describe what the code does rather than how it works. In
the head af the document some simple version control information can be included which consist
of
The name of the application
A description of the purpose of the code in file
The name of the author
The original creation date
A version number
Copyright information
In HTML document comment tags start with ‘<!’ And ends with ‘>’. Each comment can
contain many lines of text as you like. If the comment runs over a number of lines, each must
start and ends with ‘--‘.
Attribute Functionality
TEXT This attribute is used to change the default text color for an entire
document, Ex: <BODY TEXT "W800000”>
BGCOLOR This attribute is used to set a background color to the web page
Ex: <BODY BGCOLOR=”#0000FF”>
BACKGROUN This attribute is used to set an existing picture as background to the web
D page
Ex: BODY BACKGROUND= "marble jpg”>
LINK Unvisited Hyperlink With this, color can be mentioned to unvisited
hyperlink.
Ex: <BODY LINK ="#FF0000”>
This tag is used to set the size of base font using SIZE attribute. No closing tag is required for
this tag.
<Head>
<basefont size=”4”>
</head>
Font Tag: This tag allows changes to any portion of text. The attributes of this tag are as
follows.
Attribute Functionality
SIZE Allows increasing the size of font.
Ex: <FONT SIZE="3"> Welcome
</FONT>
Headline Tags
The headline tags are used to display headings on the web page in various sizes. These tags can
be used for providing main and sub headings to the web page. HTML document supports 6
levels of heading tags <H1> to<H6>. The size of the text within the <H1> tag is the largest and
<H6> tag is the smallest. Each of these headings always begins on a new line.
The syntax is
<H1> The text is placed here </H1>
HTML tags have some additional parameters called arguments or attributes to increase the
functionality of the tags.
The headings displayed in the browser window are normally left aligned. The headings can be
aligned right or in the centre by setting ALIGN attribute for his heading tag.
The syntax is
<H1 ALIGN=”Value”> The text to be placed here </H1>
The possible values for ALIGN attribute are: Centre, Left and Right.
<h1>this is a heading</h1>
<h2> this is a heading</h2>
<h3>this is a heading</h3>
<h4 >this is a heading</h4>
<h5>this is a heading</h5>
<h6>this is a heading</h6>
Backgrounds
The <body> tag has two attributes where you can specify backgrounds. The background can be a
color or an image.
Bgcolor
The bgcolor attribute specifies a background-color for an HTML page. The value of this attribute
can be a hexadecimal number, an RGB value, or a color name:
<body bgcolor="#000000">
<body bgcolor="rgb(0,0,0)">
<body bgcolor="black">
The lines above all set the background-color to black.
Background
The background attribute can also specify a background-image for an HTML page. The value of
this attribute is the URL of the image you want to use.If the image is smaller than the browser
window, the image will repeat itself until it fills the entire browser window.
<body background="clouds.gif">
<body background="http://profdevtrain.austincc.edu/html/graphics/clouds.gif">
HTML Lists
HTML provides a simple way to show unordered lists (bullet lists) or ordered lists (numbered
lists).
Unordered Lists
An unordered list is a list of items marked with bullets (typically small black circles). An
unordered list starts with the <ul> tag. Each list item starts with the <li> tag.
This Code Would Display
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
Ordered Lists
An ordered list is also a list of items. The list items are marked with numbers. An ordered list
starts with the <ol>tag. Each list item starts with the <li>tag.
This Code Would Display
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
HTML Links
HTML uses the <a> anchor tag to create a link to another document or web page. An anchor can
point to any resource on the Web: an HTML page, an image, a sound file, a movie, etc.
The syntax of creating an anchor:
<a href="url">Text to be displayed </a>.
The <a>tag is used to create an anchor to link from, the href attribute is used to tell the address of
the document or page we are linking to, and the words between the open and close of the anchor
tag will be displayed as a hyperlink.
This Code Would Display
<a href="http://www.austincc.edu/">Visit ACC!</a>
HTML Images
The <img>tag is empty, which means that it contains attributes only and it has no closing tag. To
display an image on a page, you need to use the src attribute. Src stands for "source". The value
of the src attribute is the URL of the image you want to display on your page. The syntax of
defining an image:
This Code Would Display
<img src="graphics/chef.gif">
IMPLEMENTATION
IMPLEMENTATION
SAVED AS: gangadhar.html
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>Showrooms in ndl </title>
<link href="showroom.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="nav">
<ul>
<li><a href="home.html">home</a></li>
<li><a href="service.html">Finance</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
</div>
</body>
</html>
<html>
<head>
<meta charset="utf-8"/>
<title>Showrooms in ndl/Nandi Bajaj </title>
<html>
<head>
<meta charset="utf-8"/>
<title>Showrooms in ndl/Nandi Bajaj </title>
<link href="showroom.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="nav">
<ul>
<li><a href="home.html">home</a></li>
<li><a href="service.html">Finance</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
</div>
<div id="list">
<h3><u>SOWJANYA HERO </u></h3>
<ol>
<li>HERO Splendor plus </li>
<li>HERO Glamour 125 </li>
<li>HERO HF Deluxe i3s </li>
<li>HERO Passion pro i3s </li>
<li>HERO Splendor iSMART 110 </li>
<li>HERO Super slendor </li>
<li>HERO Duet Scooty </li>
<li>HERO Masestro Edge </li>
</ol></div>
</body></html>
<html>
<head>
<meta charset="utf-8"/>
<title>Showrooms in ndl/Nandi Bajaj </title>
<link href="showroom.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="nav">
<ul>
<li><a href="home.html">home</a></li>
<li><a href="service.html">Finance</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
</div>
<div id="list">
<h3><u>SRI SAI TVS</u></h3>
<ol>
<li>TVS Victor </li>
<li>TVS Wego </li>
<li>TVS Jupiter </li>
<li>TVS Apache RR 310 </li>
<li>TVS Entorq 125 </li>
<li>TVS XL 100 </li>
<li>TVS Star city+ </li>
</ol>
</div>
</body>
</html>
<html>
<head>
<meta charset="utf-8"/>
<title>Showrooms in ndl/Nandi Bajaj </title>
<link href="showroom.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="nav">
<ul>
<li><a href="home.html">home</a></li>
<li><a href="service.html">Finance</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
</div>
<div id="list">
<h3><u>SYAM'S YAMAHA</u></h3>
<ol>
<li>YAMAHA FZ </li>
<li>YAMAHA FZ-S </li>
<li>YAMAHA FZ V2.0FL </li>
<li>YAMAHA Fazer </li>
<li>YAMAHA SZ RR </li>
<li>YAMAHA Saluto </li>
<li>YAMAHA YZF R15 </li>
<li>YAMAHA </li>
</ol>
</div>
</body>
</html>
<html>
<head>
<meta charset="utf-8"/>
<title>Showrooms in ndl/Nandi Bajaj </title>
<link href="showroom.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="nav">
<ul>
<li><a href="home.html">home</a></li>
<li><a href="service.html">Finance</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
</div>
<div id="list">
<u><h3>BAJAJ Finance </h3></u>
<ul>
<html>
<head>
<meta charset="utf-8"/>
<title>Showrooms in ndl/Nandi Bajaj </title>
<link href="showroom.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="nav">
<ul>
<li><a href="home.html">home</a></li>
<li><a href="service.html">Finance</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
</div>
<div id="list">
<u><h3>BAJAJ Finance </h3></u>
<ul>
Address: D.No: 153e, GR Floor, Magham Complex, opp. Padmavathi nagar Arch, nandyal. <br>
<html>
<head>
<meta charset="utf-8"/>
<title>Showrooms in ndl/Nandi Bajaj </title>
<link href="showroom.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="nav">
<ul>
<li><a href="home.html">home</a></li>
<li><a href="service.html">Finance</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
</div>
<div id="list">
<u><h3>BAJAJ Finance </h3></u>
<ul>
Address: 2/415, Hotel Shobha NK road, nandyal. <br>
Contact no.:+(91)9949493333 <br>
E-Mail: [email protected]
</div>
</body>
</html>
SAVED AS: contact.html
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>Showrooms in ndl </title>
<link href="showroom.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="nav">
<ul>
<li><a href="home.html">home</a></li>
<li><a href="service.html">Finance</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
</div>
<div id="list">
<div id="extra"> <marquee direction="up" behavior="alternate" scrollamount="4" width="950"
height="400">
<h1>      Contact Us</h1>
<p>      Name :M.GANGADHAR<br>
      Email:[email protected]</br>
      phone:9160410700<br>
      address: Nandyal</p>
</div></marquee>
</div>
</body>
</html>
SAVED AS: showroom.html
body{
background: url('gq-akshai-varde_0.jpg') no-repeat;
background-size: cover;
font-family: arial;
color: white;
}
#nav ul{
margin: 10px;
padding: 5px;
list-style: none;
}
#nav ul li{
float: left;
width: 200px;
height: 40px;
background-color: black;
opacity: .8;
line-height: 40px;
text-align: center;
font-size: 20px;
margin-right: 2px;
}
#nav ul li a {
text-decoration: none;
color: white;
display: block;
}
#nav ul li a:hover {
background-color: green;
}
#nav Ul li ul li{
display: none;
}
#nav ul li:hover ul li{
display: block;
}
#list{text-align: center;
font-family: cambria;
line-height: 50px;
font-weight: bold;
margin-top:100px;
}
#list ul{
background:black;
opacity: .8;
margin-left: auto;
margin-right: auto;
border-radius: 5px;
color: white;
text-align: center;
font-size: 25px;
}
#list a{
color:white;
}
#nav h1{
background: #665e59;
opacity: .8;
text-align: center;
}
#list h3{
background:black;
opacity: .8;
margin-left: auto;
margin-right: auto;
border-radius: 5px;
color: white;
text-align: center;
font-size: 30;
}
#list ol{
background:black;
opacity: .8;
margin-left: auto;
margin-right: auto;
border-radius: 5px;
color: white;
text-align: center;
font-size: 20;
}
#list ol li{
background:black;
opacity: .8;
margin-left: auto;
margin-right: auto;
border-radius: 5px;
color: white;
text-align: justify;
font-size: 20;
}
#extra h1{
text-align: center;
color:#b57a44;
background-color: #323742;
opacity: .8;
}
#extra p{
text-align: center;
color:#e9e6df;
background-color: black;
opacity: .8;
font-size: 25px;
}
SCREEN SHOTS
SCREEN SHOTS
BIBLIOGRAPHY
BIBLIOGRAPHY
Books
Master transactional HTML 4.o1 and XHTML 1.0 markup.
Write emerging standards-based markup with HTML5.
Enhance presentation with Cascading style sheets (Css1 ation with and css 2.1)
Learn proprietary and emerging css3 features.
HTML & CSS: The Complete Reference, Fifth Edition Book by Thomas Powell.
HTML5 Black Book: Covers CSS3, JavaScript. XML, XHTML, AJAX, PHP and jQuery
Paperback -Jul 2011 by Kogent Learning Solutions Inc.
Web References
https://www.w3 schools.com/
www.htmldog.com/
https://www.coursera.org/learn/html-css-javascript-for-web-developers
www.landofoode.com/
www.snoopcode.com/