Hotel Booking Site

Acknowledgement
It is our proud privilege and duty to acknowledge the kind of help and guidance
received from several people in preparation of this report. It would not have
been possible to prepare this report in this form without their valuable help,
cooperation and guidance.
First and foremost, we wish to record our sincere gratitude to Mr.
Kshtiz Srivastava sir for his constant support and encouragement in preparation of
this report and for making available library and laboratory facilities needed to
prepare this report.
The given topic was very helpful to us in giving the necessary
background information and inspiration in choosing this topic for the PPT.
Their contributions and technical support in preparing this report are greatly
acknowledged.
Last but not the least, we wish to thank our parents for financing our studies in
this college as well as for constantly encouraging us to learn engineering. Their
personal sacrifice in providing this opportunity to learn engineering is
gratefully acknowledged.
Aman Verma
Table Of Contents
Acknowledgment
CHAPTER 1. Introduction
1.1 What is a website .

1.2 Type of website.
1.3 Languages used .
1.4 What is Static Website.
CHAPTER 2. About Languages
2.1 HTML
2.2 HTML tag
2.3CSS
2.3.1 Java script
CHAPTER 3. About Project
3.1 Hotel booking site
3.2 Explore Page
3.3Rooms Page .
3.3.Booking Page
3.3.2 Contact Page
CHAPTER 4. Future Scope
CHAPTER 5. Conclusion
Chapter 1.
What is a website.
A website or web site is a collection of related network web resources, such as
web pages, multimedia content, which are typically identified with a common
domain name, and published on at least one web server. Notable examples are
wikipedia.org, google.com, and amazon.com.
Websites can be accessed via a public Internet Protocol (IP) network, such as the
Internet, or a private local area network (LAN), by a uniform resource locator
(URL) that identifies the site.
Type of Website.
 E-commerce Website. An e-commerce website is a website people can

directly buy products from. ...
 Business Website. A business website is any website that's devoted to
representing a specific business. ...
 Entertainment Website. ...
 Portfolio Website. ...
 Media Website. ...
 Brochure Website. ...
 Nonprofit Website. ...
 Personal Website.
Languages used.
1 HTML
2 CSS
3 Java script
What is a Static Website.
A static website contains Web pages with fixed content. Each page is coded in
HTML and displays the same information to every visitor. Static sites are the most
basic type of website and are the easiest to create. Unlike dynamic websites, they
do not require any Web programming or database design. A static site can be built
by simply creating a few HTML pages and publishing them to a Web server.
Since static Web pages contain fixed code, the content of each page does not
change unless it is manually updated by the webmaster. This works well for small
websites, but it can make large sites with hundreds or thousands of pages difficult
to maintain. Therefore, larger websites typically use dynamic pages, which can be
updated by simply modifying a database record. Static sites that contain a lot of
pages are often designed using templates. This makes it possible to update several
pages at once, and also helps provide a consistent layout throughout the site.
Chapter 2
HTML.
Hypertext Markup Language (HTML) is the standard markup language for
documents designed to be displayed in a web browser. It can be assisted by
technologies such as Cascading Style Sheets (CSS) and scripting languages such as
JavaScript.
Web browsers receive HTML documents from a web server or from local storage
and render the documents into multimedia web pages. HTML describes the
structure of a web page semantically and originally included cues for the
appearance of the document.
HTML elements are the building blocks of HTML pages. With HTML constructs,
images and other objects such as interactive forms may be embedded into the
rendered page. HTML provides a means to create structured documents by
denoting structural semantics for text such as headings, paragraphs, lists, links,
quotes and other items. HTML elements are delineated by tags, written using angle
brackets. Tags such as <img /> and <input /> directly introduce content into the
page. Other tags such as <p> surround and provide information about document
text and may include other tags as sub-elements. Browsers do not display the
HTML tags, but use them to interpret the content of the page.
HTML can embed programs written in a scripting language such as JavaScript,

which affects the behavior and content of web pages. Inclusion of CSS defines the
look and layout of content. The World Wide Web Consortium (W3C), former
maintainer of the HTML and current maintainer of the CSS standards, has
encouraged the use of CSS over explicit presentational HTML since 1997.
HTML Tags
HTML tags are like keywords which defines that how web browser will format and
display the content. With the help of tags, a web browser can distinguish between
an HTML content and a simple content. HTML tags contain three main parts:
opening tag, content and closing tag. But some HTML tags are unclosed tags.
When a web browser reads an HTML document, browser reads it from top to
bottom and left to right. HTML tags are used to create HTML documents and
render their properties. Each HTML tags have different properties.
CSS.
CSS is designed to enable the separation of presentation and content, including

layout, colors, and fonts.This separation can improve content accessibility, provide
more flexibility and control in the specification of presentation characteristics,
enable multiple web pages to share formatting by specifying the relevant CSS in a
separate .css file, and reduce complexity and repetition in the structural content.
Separation of formatting and content also makes it feasible to present the same
markup page in different styles for different rendering methods, such as on-screen,
in print, by voice (via speech-based browser or screen reader), and on Braille-
based tactile devices. CSS also has rules for alternate formatting if the content is
accessed on a mobile device.
The name cascading comes from the specified priority scheme to determine which
style rule applies if more than one rule matches a particular element. This
cascading priority scheme is predictable.
Java Script
JavaScript is a dynamic computer programming language. It is lightweight and

most commonly used as a part of web pages, whose implementations allow client-
side script to interact with the user and make dynamic pages. It is an interpreted
programming language with object-oriented capabilities.
JavaScript was first known as LiveScript, but Netscape changed its name to
JavaScript, possibly because of the excitement being generated by Java. JavaScript
made its first appearance in Netscape 2.0 in 1995 with the name LiveScript. The
general-purpose core of the language has been embedded in Netscape, Internet
Explorer, and other web browsers.
Chapter 3
HOTEL Booking site
HOME page of hotel booking site . where you see the details about hotel and make
reservation of ROOMS
1.Code use to create Home Page.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> Magestic Hotel</title>
<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="dist/slick.js"></script>
<link rel="stylesheet" type="text/css" href="css/main.css">
<link rel="stylesheet" type="text/css" href="css/slick.css">

<script type="text/javascript" src="dist/demo.js"></script>
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"
</head>
<body >
<header class="tm-header">
<img class="tm-logo" src="images/Majestic_Hotel_hd.png" alt="Majestic Hotel">
<nav class="tm-nav" >
<div>
<ul>
<li class="tm-list"><a href="index.html">Home</a></li>
<li class="tm-list"><a href="explore.html">Explore </a></li>
<li class="tm-list"><a href="rooms.html">Rooms</a></li>
<li class="tm-list"><a href="bb.html">Booking</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
</nav>
</header>
<section class="tm-imgslider">
<div class="slider single">
<div><div class="tm-slider"><img class="tm-sliderimage"

src="images/main_slider11.png" alt="Majestic Hotel">
<div class="tm-slidertext">
<p class="bold"> Expierence</p>
<p class="simple">The Beauty and ambience </p>
<p class="simple">All in one place </p></div>
</div></div>

<p class="simple">The tranquility </p>
<p class="simple">in hotel spa and swimming pool </p></div>
</div></div>

<p class="simple">The luxorious interiors </p>
<p class="simple">in every hotel room </p></div>
</div></div>

<p class="bold"> Expirence</p>
<p class="simple">The mesmerizing beach view </p>
<p class="simple">from your room's balcony</p></div>

</div></div>
</div>
<img src="images/back.png" class="left">
<img src="images/next.png" class="right">
</section>
<section class="slider room flex">
<div class="tm-rooms">
<img src="images/luxury.png">
<a href="rooms.html"> <p class="s">Luxury Suite</p> </a>
</div>
<img src="images/delux.png">
<a href="rooms.html"> <p class="s">Delux Suite</p></a>
</div>
<img src="images/premier.png">
<a href="rooms.html"> <p>Premier Suite</p></a>
</div>
<img src="images/luxuryroom.png">
<a href="rooms.html"> <p class="s">Luxury Room</p> </a>
</div>
<img src="images/deluxroom.png">
<a href="rooms.html"> <p>Delux Room</p></a>
</div>
<img src="images/premiumroom.png">
<a href="rooms.html"> <p>Premier Room</p></a>
</div>
</section>
<section class="tm-servicesection">
<div class="tm-service">
<img class="tm-serimage" src="images/bell.png">
<div>
<p class="b">Room Service</p>
<p> Enjoy your stay with excellent and timely room service </p> </div>
</div>
<img class="tm-serimage" src="images/coffee.png">
<div>
<p class="b">Free Breakfast</p>
<p> Enjoy Free breakfast every morning</p> </div>
</div>
</section>
<section class="tm-servicesection">
<img class="tm-serimage" src="images/car-front.png">
<div>
<p class="b">Free Parking</p>
<p> No need to pay any extra charges to park your vehicle </p> </div>
</div>
<img class="tm-serimage" src="images/spa.png">
<div>
<p class="b">Free Spa</p>
<p> Relax at the inhouse Spa once every day of your stay </p> </div>
</div>
</section>
<section class="tm-makeres">
<div class="tm-res">
<div class="tm-resbutton">
<a href="bb.html"> <p>Make Reservation</p></a>
</div>
</div>
</section>
<footer class="tm-footer">
<div class="tm-us">
<p class="bold">About Us</p>
<p>We are a part of chain of luxury hotels
which extends all over the world. We

provide a luxorious stay with various value
added and free services which will make
you visit us over and over again.</p>
</div>
<div class="tm-address">
<p class="bold">Address</p>
<p> Lucknow
Phone : (211) 9275693451
Email : lucknow@info.com</p>
</div>
<br/>

</footer>
</body>
</html>
2.EXPLORE Page
Code of Explore page.

<!DOCTYPE html>
<html>
<head>
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<script type="text/javascript" src="dist/jquery.scrollUp.js"></script>

</head
<body>
<nav class="tm-nav">
<div>
<ul>
<li class="tm-list"><a href="explore.html">Explore</a></li>
</ul>
</div>
</nav>
</header>
<section class="tm-main">
<p>Explore</p>
</section>
<section class="tm-expsection">
<div class="tm-exp1">
<p> Luxorious and Spacious Rooms</p>
<img src="images/luxorius.png">
</div>
</section>
<p> Inhouse Spa</p>
<img src="images/spahouse.png" >
</div>
</section>
<p> Swimming Pools</p>
<img src="images/swimming.png">
</div>
</section>
<p> Indoor Game Room</p>
<img src="images/play.png" >
</div>
</section>
</div>
</div>
</section>
<div class="tm-us">
</div>
<p> Lucknow
Phone : (211) 9275693451
</div>
<br/>

</footer>
</body>
</html>
3.ROOMS Page
Code of Rooms Page.

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div>
<ul>
</ul>
</div>
</nav>
</header>
<p>Rooms</p>
</section>
<section class="tm-roomsection">
<div class="tm-room1">
<div class="tm-trans"> <div><p>2 Bed</p><p>Complimentary liquor</p><p>Free Wifi</p>

</div>
<div><p>Only for</p><p class="bold">$ 1999.99</p> </div></div
<img class="tm-roomimage" src="images/luxury.png">
<p class="s">Luxury Suite</p>
</div>
<div class="tm-trans"> <div><p>2 Bed</p><p>Luxorious interior</p><p>Free Wifi</p>
</div>
<div><p>Only for</p><p class="bold">$ 1599.99</p> </div></div>
<img class="tm-roomimage" src="images/delux.png">
<p>Delux Suite</p>
</div>
<div class="tm-trans"> <div><p>2 Bed</p><p>Scenic View</p><p>Free Wifi</p> </div>
<img class="tm-roomimage" src="images/premier.png">
<p>Premier Suite</p>
</div>
</section>
<br/>
<section class="tm-roomsection">
<div class="tm-trans"> <div><p>2 Bed</p><p>Free wifi</p><p>Fresh towels</p> </div>
<img class="tm-roomimage" src="images/luxuryroom.png">
<p class="s">Luxury Room</p>

</div>
<div class="tm-trans"> <div><p>2 Bed</p><p>Fresh towels</p><p>Less costly</p>

</div>
<img class="tm-roomimage" src="images/deluxroom.png">
<p>Delux Room</p>
</div>
<div class="tm-trans"> <div><p>1 Bed</p><p>Fresh towels</p><p>Less costly</p> </div>
<img class="tm-roomimage" src="images/premiumroom.png">
<p>Premier Room</p>
</div>
</section>
<br/>
</div>
</div>
</section>
<div class="tm-us">
</div>
<p> Lucknow
Phone : (211) 9275693451
</div>
<br/>
</footer>
</body>
</html>
4. BOOKING PAGE
Code of Booking page.

<!DOCTYPE html>
<html>
<head>
<title> Majestic Hotel</title>
<script type="text/javascript" src="dist/pickmeup.min.js"></script>
<script type="text/javascript" src="dist/handleCounter.js"></script>
<link rel="stylesheet" type="text/css" href="css/pickmeup.css">
<link rel="stylesheet" type="text/css" href="css/handle-counter.min.css">

</head>
<body>
<div>
<ul>
</ul>
</div>
</nav>
</header>
<p>Booking</p>
</section>
<section class="tm-booking">
<form>
<div class="tm-form1">
<input type="text" name="name" placeholder="Name">
<input type="email" name="email" placeholder="E-mail">

<label for="rooms" id="inlinelable">Rooms</label>
<select name="Rooms" id="rooms">
<option value="luxurys">Luxury Suite</option>
<option value="deluxs">Delux Suite</option>
<option value="premiers">Premier Suite</option>
<option value="Luxuryr">Luxury Room</option>
<option value="deluxs">Delux Room</option>
<option value="premierr">Premier Room</option>
</select>
<div class="tm-num1" id="handleCounter1">
<label for="number1" >Number of Rooms</label><br/>
<button type="button" class="counter-minus btn btn-primary">- </button>
<input type="text" name="number1" id="number1" value="1">
<button type="button" class="counter-plus btn btn-primary">+ </button>
</div>
<div class="tm-num2" id="handleCounter2">
<label for="number2">Number of Guests</label><br/>
<button type="button" class="counter-minus btn btn-primary">-</button>
<input type="text" name="number2" id="number2" value="1">
<button type="button" class="counter-plus btn btn-primary">+</button>
</div>
</div>
<div class="vertical-line"> </div>
<div class="tm-cl">
<label for="date1" class="arrival">Visiting Dates from Arrival to Departure</label>
<input type="text" name="date1" class="range" readonly="readonly">
<input type="submit" id="sub" value="Proceed">
</div>
</div>
</form>
</section>
<div class="tm-us">
</div>
<p>lucknow
Phone : (211) 9275693451
</div>
<br/>
</footer>
</body>
</html>
5.CONTACT PAGE
Code to create Contact page.

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="dist/pickmeup.min.js"></script>

<script type="text/javascript" src="dist/handleCounter.js"></script>
<link rel="stylesheet" type="text/css" href="css/pickmeup.css">
<link rel="stylesheet" type="text/css" href="css/handle-counter.min.css">
</head>
<body>
<div>
<ul>
</ul>
</div>
</nav>
</header>
<p>Contact</p>
</section>
<section class="tm-booking">
<form>
<input type="text" name="name" placeholder="Name">
<input type="email" name="email" placeholder="E-mail">
<textarea placeholder="Your message..." rows="4" ></textarea>
<input type="submit" id="sub2" value="Send">
</div>
</form>
<div class="vertical-line"> </div>
<div class="tm-cl">
<div id="map"></div>
</div>
</div>
</section>
<div class="tm-us">
</div>
<p> Lucknow
Phone : (211) 9275693451
</div>
<br/>
</footer>
</body>
</html>
Chapter 4
Future Scope :
Main characteristics of a Hotel Reservation system Inventory is
stored in numerous locations specific to each property in the
hotel network and may be accessed through any of the several
different paths by any given customer or booking system.
 The closer one movers into the reservation activity, the more
accurate the reservations become. Therefore contacting the
individual property directly produces the more accurate result.
 Decisions as to the availability of inventory only reflect the
actual number of available rooms rather they end upon booking
channel employed, the maintainance of the channel, it’s
proximity to the actual property and the accuracy with which the
individual property manager is able to predict occupancy and
demand from day to day.
Chapter 5
Conclusion
I believe the trial has shown conclusively that it is both possible and desirable to use HTML as
the principal Scripting language:
 It is Free (as in both cost and source code).

 It is trivial to install on a Windows PC allowing students to take their interest further. For
many the hurdle of installing a Pascal or C compiler on a Windows machine is either too
expensive or too complicated;
 It is a flexible tool that allows both the teaching of traditional procedural programming
and modern OOP; It can be used to teach a large number of transferable skills;
 It is a real-world Scripting language that can be and is used in academia and the
commercial world;
 It appears to be quicker to learn and, in combination with its many libraries, this offers
the possibility of more rapid student development allowing the course to be made more
challenging and varied;
 and most importantly, its clean syntax offers increased understanding and enjoyment for
students;

Hotel Booking Site

Uploaded by

Copyright:

Available Formats

You might also like

Hotel Booking Site

Uploaded by

Document Information

Original Description:

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Hotel Booking Site

Uploaded by

Copyright:

Available Formats

Acknowledgement

cooperation and guidance.

First and foremost, we wish to record our sincere gratitude to Mr.

prepare this report.

The given topic was very helpful to us in giving the necessary

this college as well as for constantly encouraging us to learn engineering. Their

personal sacrifice in providing this opportunity to learn engineering is

1.1 What is a website .

CHAPTER 2. About Languages

2.2 HTML tag

2.3.1 Java script

CHAPTER 3. About Project

3.1 Hotel booking site

3.2 Explore Page

3.3.2 Contact Page

CHAPTER 4. Future Scope

 E-commerce Website. An e-commerce website is a website people can

HTML can embed programs written in a scripting language such as JavaScript,

CSS is designed to enable the separation of presentation and content, including

JavaScript is a dynamic computer programming language. It is lightweight and

1.Code use to create Home Page.

<title> Magestic Hotel</title>

<script type="text/javascript" src="dist/slick.js"></script>

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

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

<script type="text/javascript" src="dist/demo.js"></script>

<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"

<img class="tm-logo" src="images/Majestic_Hotel_hd.png" alt="Majestic Hotel">

<nav class="tm-nav" >

<li class="tm-list"><a href="index.html">Home</a></li>

<li class="tm-list"><a href="explore.html">Explore </a></li>

<li class="tm-list"><a href="rooms.html">Rooms</a></li>

<li class="tm-list"><a href="bb.html">Booking</a></li>

<div><div class="tm-slider"><img class="tm-sliderimage"

<p class="bold"> Expierence</p>

<p class="simple">The Beauty and ambience </p>

<p class="simple">All in one place </p></div>

<div><div class="tm-slider"><img class="tm-sliderimage"

<p class="bold"> Expierence</p>

<p class="simple">The tranquility </p>

<p class="simple">in hotel spa and swimming pool </p></div>

<div><div class="tm-slider"><img class="tm-sliderimage"

<p class="bold"> Expierence</p>

<p class="simple">The luxorious interiors </p>

<p class="simple">in every hotel room </p></div>

<div><div class="tm-slider"><img class="tm-sliderimage"

<p class="bold"> Expirence</p>

<p class="simple">The mesmerizing beach view </p>

<p class="simple">from your room's balcony</p></div>

<img src="images/back.png" class="left">

<img src="images/next.png" class="right">

<section class="slider room flex">

<a href="rooms.html"> <p class="s">Luxury Suite</p> </a>

<a href="rooms.html"> <p class="s">Delux Suite</p></a>

<a href="rooms.html"> <p>Premier Suite</p></a>

<a href="rooms.html"> <p class="s">Luxury Room</p> </a>