Project Report 2

1
Hotel Management system
ABSTRACT
INTRODUCTION
1. Introduction
1.1 Purpose
Currently, many restaurants use a paper-based system to communicate
between the restaurant and kitchen which can be shown to be one of the least
efficient approaches. Even though this approach is implemented in successful
profitable restaurants.
1.2 Scope
• This system will help to manage and run the restaurant business
systematically.
• In the management system, we will provide an app that can be used

by the customers to
order food.
• Customers can also give feedback through this app.
• So that owner of the restaurant can evaluate the whole system. This
will ultimately lead to hire less waiters
1.3.1 Overview
This document presents a detailed explanation of the objectives, features, user
interface and application of Restaurant Management System in real life. It will
also describe how the system will perform and under which it must operate. In
this document it will be also shown user interface. Both the stakeholders and
the developers of the system can benefit from this document.
2
1.4 Additional Information

• System Admin System admin is a person who is responsible for
managing
the whole system and who has full access to the system.
• System User A person who is using or operating the system but with a
limited privilege.
• Database Collection of all the information monitored by this system.
Software Requirements:
 Operating System :Windows XP,window7
 Client side Technology : HTML, css
Hardware Requirements:
 Pentium 4 processor
 1 GB RAM
 40 GB Hard Disk Space

3
HTML Style Sheet

Cascading Style Sheets (CSS) describe how documents are presented on
screens, in print, or perhaps how they are pronounced. W3C has actively
promoted the use of style sheets on the Web since the Consortium was
founded in 1994.
Cascading Style Sheets (CSS) provide easy and effective alternatives to specify
various attributes for the HTML tags. Using CSS, you can specify a number of
style properties for a given HTML element. Each property has a name and a
value, separated by a colon (:). Each property declaration is separated by a
semi-colon (;).
Example
First let's consider an example of HTML document which makes use of <font>
tag and associated attributes to specify text color and font size:
<!DOCTYPE html>
<html>
<head>
<title>HTML CSS</title>
</head>
<body>
<p><font color="green" size="5">Hello, World!</font></p>
</body>
</html>
We can re-write above example with the help of Style Sheet as follows:
<!DOCTYPE html>
<html>
<head>
<title>HTML CSS</title>
</head>
4
<body>
<p style="color:green;font-size:24px;">Hello, World!</p>
</body>
</html>
This will produce following result:
Hello, World!
You can use CSS in three ways in your HTML document:
 External Style Sheet - Define style sheet rules in a separate .css file
and then include that file in your HTML document using HTML <link>
tag.
 Internal Style Sheet - Define style sheet rules in header section of
the HTML document using <style> tag.
 Inline Style Sheet - Define style sheet rules directly along-with the
HTML elements using style attribute.
Let's see all the three cases one by one with the help of suitable examples .
External Style Sheet

If you need to use your style sheet to various pages, then its always
recommended to define a common style sheet in a separate file. A cascading
style sheet file will have extension as .css and it will be included in HTML files
using <link> tag.
Example
Consider we define a style sheet file style.css which has following rules:
.red{
color: red;
}
.thick{
font-size:20px;
}
5
.green{
color:green;}
Here we defined three CSS rules which will be applicable to three different
classes defined for the HTML tags. I suggest you should not bother about how
these rules are being defined because you will learn them while studying CSS.
Now let's make use of the above external CSS file in our following HTML
document:
<!DOCTYPE html>
<html>
<head>
<title>HTML External CSS</title>
<link rel="stylesheet" type="text/css" href="/html/style.css">
</head>
<body>
<p class="red">This is red</p>
<p class="thick">This is thick</p>
<p class="green">This is green</p>
<p class="thick green">This is thick and green</p>

</body>
</html>
This is red
This is thick
This is green
This is thick and green

6
Internal Style Sheet

If you want to apply Style Sheet rules to a single document only then you can
include those rules in header section of the HTML document using <style> tag.
Rules defined in internal style sheet overrides the rules defined in an external
CSS file.
Example
Let's re-write above example once again, but here we will write style sheet
rules in the same HTML document using <style> tag:
<!DOCTYPE html>
<html>
<head>
<title>HTML Internal CSS</title>
<style type="text/css">
.red{
color: red;
}
.thick{
font-size:20px;
}
.green{
color:green;
}
</style>
</head>
<body>
<p class="red">This is red</p>
<p class="thick">This is thick</p>

7
<p class="green">This is green</p>
<p class="thick green">This is thick and green</p>

</body>
</html>
This is red
This is thick
This is green
Inline Style Sheet

You can apply style sheet rules directly to any HTML element
using style attribute of the relevant tag. This should be done only when you
are interested to make a particular change in any HTML element only.
Rules defined inline with the element overrides the rules defined in an external
CSS file as well as the rules defined in <style> element.
Example
Let's re-write above example once again, but here we will write style sheet
rules along with the HTML elements using style attribute of those elements.
<!DOCTYPE html>
<html>
<head>
<title>HTML Inline CSS</title>
</head>
<body>
<p style="color:red;">This is red</p>
8
<p style="font-size:20px;">This is thick</p>
<p style="color:green;">This is green</p>
<p style="color:green;font-size:20px;">This is thick and green</p>

</body>
</html>
This is red
This is thick
This is green
HTML Forms
HTML Forms are required when you want to collect some data from the site
visitor. For example during user registration you would like to collect
information such as name, email address, credit card, etc.
A form will take input from the site visitor and then will post it to a back-end
application such as CGI, ASP Script or PHP script etc. The back-end
application will perform required processing on the passed data based on
defined business logic inside the application.
There are various form elements available like text fields, textarea fields, drop-
down menus, radio buttons, checkboxes, etc.
The HTML <form> tag is used to create an HTML form and it has following

syntax:
9
<formaction="Script URL"method="GET|POST">
form elements like input, textarea etc.
</form>
Form Attributes
Apart from common attributes, following is a list of the most frequently used
form attributes:
Attribut Description
e
action Backend script ready to process your passed data.
method Method to be used to upload data. The most frequently used

are GET and POST methods.
target Specify the target window or frame where the result of the
script will be displayed. It takes values like _blank, _self,
_parent etc.
enctype You can use the enctype attribute to specify how the browser
encodes the data before it sends it to the server. Possible
values are:
 application/x-www-form-urlencoded - This is the

standard method most forms use in simple scenarios.
 mutlipart/form-data - This is used when you want to

upload binary data in the form of files like image, word
file etc.
Note: You can refer to Perl & CGI for a detail on how form data upload works.
HTML Form Controls

10
There are different types of form controls that you can use to collect data
using HTML form:
 Text Input Controls
 Checkboxes Controls
 Radio Box Controls
 Select Box Controls
 File Select boxes
 Hidden Controls
 Clickable Buttons
 Submit and Reset Button
Text Input Controls

There are three types of text input used on forms:
 Single-line text input controls - This control is used for items that
require only one line of user input, such as search boxes or names.
They are created using HTML <input> tag.
 Password input controls - This is also a single-line text input but it

masks the character as soon as a user enters it. They are also created
using HTMl <input> tag.
 Multi-line text input controls - This is used when the user is required
to give details that may be longer than a single sentence. Multi-line
input controls are created using HTML <textarea> tag.
Single-line text input controls

This control is used for items that require only one line of user input, such as
search boxes or names. They are created using HTML <input> tag.
Example
11
Here is a basic example of a single-line text input used to take first name and
last name:
<!DOCTYPE html>
<html>
<head>
<title>Text Input Control</title>
</head>
<body>
<form>
First name: <inputtype="text"name="first_name"/>
<br>
Last name: <inputtype="text"name="last_name"/>
</form>
</body>
</html>
First name:
Last name:
Attributes
Following is the list of attributes for <input> tag for creating text field.
Attribute Description
type Indicates the type of input control and for text input control it
will be set totext.
name Used to give a name to the control which is sent to the server
to be recognized and get the value.
value This can be used to provide an initial value inside the control.
12
size Allows to specify the width of the text-input control in terms

of characters.
maxlength Allows to specify the maximum number of characters a user

can enter into the text box.
Password input controls

This is also a single-line text input but it masks the character as soon as a
user enters it. They are also created using HTML <input> tag but type
attribute is set to password.
Example
Here is a basic example of a single-line password input used to take user
password:
<!DOCTYPE html>
<html>
<head>
<title>Password Input Control</title>
</head>
<body>
<form>
User ID : <inputtype="text"name="user_id"/>
<br>
Password: <inputtype="password"name="password"/>
</form>
</body>
</html>
User ID :
Password:
13
Attributes
Following is the list of attributes for <input> tag for creating password field.
Attribute Description
type Indicates the type of input control and for password input
control it will be set to password.
value This can be used to provide an initial value inside the control.
size Allows to specify the width of the text-input control in terms

of characters.
maxlength Allows to specify the maximum number of characters a user

can enter into the text box.
Multiple-Line Text Input Controls

This is used when the user is required to give details that may be longer than
a single sentence. Multi-line input controls are created using HTML <textarea>
tag.
Example
Here is a basic example of a multi-line text input used to take item
description:
<!DOCTYPE html>
<html>
<head>
<title>Multiple-Line Input Control</title>
</head>
14
<body>
<form>
Description : <br/>
<textarearows="5"cols="50"name="description">
Enter description here...
</textarea>
</form>
</body>
</html>
Description :
Attributes
Following is the list of attributes for <textarea> tag.
e
rows Indicates the number of rows of text area box.
cols Indicates the number of columns of text area box
Checkbox Control
Checkboxes are used when more than one option is required to be selected.
They are also created using HTML <input> tag but type attribute is set
to checkbox.
15
Example
Here is an example HTML code for a form with two checkboxes:
<!DOCTYPE html>
<html>
<head>
<title>Checkbox Control</title>
</head>
<body>
<form>
<inputtype="checkbox"name="maths"value="on"> Maths
<inputtype="checkbox"name="physics"value="on"> Physics
</form>
</body>
</html>
Maths Physics
Attributes
Following is the list of attributes for <checkbox> tag.
e
type Indicates the type of input control and for checkbox input
control it will be set to checkbox.
value The value that will be used if the checkbox is selected.

16
checked Set to checked if you want to select it by default.
Radio Button Control

Radio buttons are used when out of many options, just one option is required
to be selected. They are also created using HTML <input> tag but type
attribute is set to radio.
Example
Here is example HTML code for a form with two radio buttons:
<!DOCTYPE html>
<html>
<head>
<title>Radio Box Control</title>
</head>
<body>
<form>
<inputtype="radio"name="subject"value="maths"> Maths
<inputtype="radio"name="subject"value="physics"> Physics
</form>
</body>
</html>
Maths Physics
Attributes
Following is the list of attributes for radio button.
e
type Indicates the type of input control and for checkbox input
17
control it will be set to radio.
value The value that will be used if the radio box is selected.
checked Set to checked if you want to select it by default.
Select Box Control

A select box, also called drop down box which provides option to list down
various options in the form of drop down list, from where a user can select one
or more options.
Example
Here is example HTML code for a form with one drop down box
<!DOCTYPE html>
<html>
<head>
<title>Select Box Control</title>
</head>
<body>
<form>
<selectname="dropdown">
<optionvalue="Maths"selected>Maths</option>
<optionvalue="Physics">Physics</option>
</select>
</form>
</body>
</html>

18
Maths

Attributes
Following is the list of important attributes of <select> tag:
e
size This can be used to present a scrolling list box.
multiple If set to "multiple" then allows a user to select multiple items

from the menu.
Following is the list of important attributes of <option> tag:
e
value The value that will be used if an option in the select box box is
selected.
selected Specifies that this option should be the initially selected value
when the page loads.
label An alternative way of labeling options
File Upload Box

If you want to allow a user to upload a file to your web site, you will need to
use a file upload box, also known as a file select box. This is also created
using the <input> element but type attribute is set to file.
Example
19
Here is example HTML code for a form with one file upload box:
<!DOCTYPE html>
<html>
<head>
<title>File Upload Box</title>
</head>
<body>
<form>
<inputtype="file"name="fileupload"accept="image/*"/>
</form>
</body>
</html>
Attributes
Following is the list of important attributes of file upload box:
e
accept Specifies the types of files that the server accepts.
Button Controls
There are various ways in HTML to create clickable buttons. You can also
create a clickable button using <input> tag by setting its type attribute
to button. The type attribute can take the following values:
Type Description
20
submit This creates a button that automatically submits a form.
reset This creates a button that automatically resets form controls to

their initial values.
button This creates a button that is used to trigger a client-side script

when the user clicks that button.
image This creates a clickable button but we can use an image as

background of the button.
Example
Here is example HTML code for a form with three types of buttons:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form>
<inputtype="submit"name="submit"value="Submit"/>
<inputtype="reset"name="reset"value="Reset"/>
<inputtype="button"name="ok"value="OK"/>
<inputtype="image"name="imagebutton"src="/html/images/logo.png"/>
</form>
</body>
</html>

21
Submit Reset

Hidden Form Controls

Hidden form controls are used to hide data inside the page which later on can
be pushed to the server. This control hides inside the code and does not
appear on the actual page. For example, following hidden form is being used
to keep current page number. When a user will click next page then the value
of hidden control will be sent to the web server and there it will decide which
page has be displayed next based on the passed current page.
Example
Here is example HTML code to show the usage of hidden control:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form>
<p>This is page 10</p>
<inputtype="hidden"name="pagename"value="10"/>
<inputtype="submit"name="submit"value="Submit"/>
<inputtype="reset"name="reset"value="Reset"/>
</form>
</body>
</html>
This is page 10
22
Submit Reset

CODING:
index.html PAGE
<!DOCTYPE>
<html>
<head>
<title>Hotel Management</title>
<link rel="stylesheet" type="text/css" href="index.css"/>
<link rel="stylesheet" type="text/css" href="dhtmlxcalendar.css"/>
<script src="dhtmlxcalendar.js"></script>
<style>
#calendar,
#calendar2,
{
border: 1px solid #909090;
font-family: Tahoma;
font-size: 12px;
}
</style>
<script>
var myCalendar;
function doOnLoad()
{
23
myCalendar = new
dhtmlXCalendarObject(["calendar","calendar2",]);
}
</script
</head>
<body onload="doOnLoad();">
<div id="holder"><a href="https://www.co.in"><img
src="images/22.jpg" width="200px" height="100px"/></a>
<div id="header">
<ul>
<li><a href="login.html">Login</a></li>
<li><a
href="http://localhost/project/overview.html">Overview</a></li>
<li><a
href="http://localhost/project/rest/index.html">Restaurant</a></
li>
<li><a href="book.html">Booking</a></li>
<li><a href="index.html">Home</a></li>
</ul>
</div>
<br>
<div id="ab">
<div id="check">
<br>
<form action="check.php" method="post">
<div style="position:relative;height:80px;">
<label for="in">Check
in:</label>
<input id="calendar" name="in" placeholder="2015-06-
02" required="" type="text"><br><br>
<label for="in">Check out:</label>

<input id="calendar2" name="out" placeholder="2015-06-
05" required="" type="text"><br><br>
</div>
Room Type:
<select name="room">
24
<option value="A/C">A/C</option>
<option value="Non-A/C">Non-A/C</option>
</select>
<select name="type">
<option value="single">Single</option>
<option value="double">Double</option>
<option value="three">Three</option>
</select>
<br><br>

<input type="submit" name="submit" value="submit" />
<input type="reset" name="reset" value="Reset" />
</form>
</div>

<div id="chat">
<form action="" method="post">
<label for="in">Chat</label>
<input id="chat" name="chat"
placeholder="message" required="">



<input type="submit" name="submit"
value="submit" />
</form>
</div>
<br>
<br>
<div id="fd">
<label for="in">Feedback</label>
<input id="fd" name="feed"
placeholder="Type message" required="">
25



value="submit" />
</form>
</div>
</div>
<br clear="all"/>
<div id="ac">
<h1>A/C</h1>
<div id="a">
<br><br><br><br>

Single Rs.2000
<br>
<a href="video.html"><input type="submit" value="View"></a>
<a href="book.html"><input type="submit"
value="Booking"></a>
</div>
<div id="b">
<br><br><br><br>

Double Rs.3000
<br>
</div>
<div id="c">
<br><br><br><br>

Three Rs.5000
<br>
26

<a href="book.html"><input type="submit" value="Booking"></a>
</div>
</div>
<div id="offer">
<h1>Special Offers</h1>
<div id="a1"><p> </p>
<br><br>
Single Bed<br>
Three Booking<br>For <b>5</b>% discount
</div>
<div id="b1"><p> </p><br>
<br>
Double Bed<br>
Three Booking<br> For <b>10</b>% discount
</div>
<div id="c1"><p> </p><br>
<br>
Three Bed<br>
Three Booking<br> For <b>15</b>% discount
</div>
</div>
<div id="nonac">
<h1>Non-A/C</h1>
<div id="a2">
<p> </p>

Single Rs.1000
<br>
</div>
<div id="b2">
<p> </p>

Double Rs.2000
<br>
27

</div>
<div id="c2">
<p> </p>

Three Rs.3500
<br>
<a href="book.html"><input type="submit" value="Booking"></a>
</div>
</div>
<div id="rest">
<h1>Special Dishes</h1>
<div id="a3">
</div>
<div id="b3">
<a href="#"></a>
</div>
<div id="c3">
</div>
</div>
</div>
</body>
</html>
28
Book.html PAGE
<!DOCTYPE>
<html>
<head>
<title>Booking</title>
<link rel="stylesheet" type="text/css"
href="book.css"/>
29

href="dhtmlxcalendar.css"/>
<style>
#calendar,
#calendar2,
#calendar3,
#calendar4,
{
font-size: 12px;
}
</style>
<script>
var myCalendar;
function doOnLoad()
{
myCalendar = new
dhtmlXCalendarObject(["calendar","calendar2","calen
dar3","calendar4",]);
}
</script>
</head>
src="images/22.jpg" width="200px"
height="100px"/></a>
<div id="header">
30
<ul>
<li><a href="overview.html">Overview</a></li>
<li><a
href="rest/index.html">Restaurant</a></li>
</ul>
<div id="ab">
<div id="check">
<br>
in:</label>
<input id="calendar" name="in"
placeholder="2015-06-02" required=""
type="text"><br><br>
out:</label>
<input id="calendar2" name="out"
</div>
Room Type:
31
<option
value="Non-A/C">Non-A/C</option>
</select>
<option
value="double">Double</option>
</select>
<br><br>
       &
nbsp;
value="submit" />
<input type="reset" name="reset"
value="Reset" />
</form>
</div>

<div id="chat">
       &
nbsp;
32
       &
nbsp;
       &
nbsp;
<input type="submit"
name="submit" value="submit" />
</form>
</div>
<br>
<br>
<div id="fd">
       &
nbsp;
       &
nbsp;
       &
nbsp;
33
</form>
</div>
</div>
<div id="book">
<h1>Booking</h1>
<div id="a1">
<p> </p>

<label
for="name">Name:</label>   &nb
sp;
<input id="name" name="name"
placeholder="Full Name" required="" tabindex="1"
<label
for="email">Email</label>   &nb
sp;      &nbsp
;
<input id="email" name="email"
placeholder="Email" required=""
type="email"><br><br>
<label for="mobile">Mobile
No:</label>
<input id="phone" name="mobile"
placeholder="Number" required=""
34
in:</label>
<input id="calendar3" name="in"
<label for="out">Check
out:</label>
<input id="calendar4" name="out"
</div>
Room Type:
<option
</select>
<option
value="single">Single</option>
<option
<option
value="three">Three</option>
</select>
<br/><br/><br/>
<a href="payment.html"><input type="submit"
name="submit" value="Book"/></a>
<input type="reset" name="reset" value="Reset" />
35
</form>
</div>
</div>
<div id="rest">
<div id="a3">
</div>
<div id="b3">
</div>
<div id="c3">
</div>
</div>
</div>
</body>
</html>
36
Overview.html PAGE
<!DOCTYPE>
<html>
<head>
<title>login</title>
href="overview.css"/>
</head>
<body>
<div id="header">
<ul>
<li><a
</ul>
37
<div id="gallery">
<h1>Photo</h1>
<img src="images/over/01.jpg"
width="150px" height="100px"/>
width="150px" height="100px"/><br>
width="150px" height="100px"/><br>
</div>
<div id="contact">
<h1>Contact Us</h1>
<div id="b1">
38
<h2>      &nb
sp;Seema</h2>
<h2>      &nb
sp; 9166004022</h2>
</div>
<div id="b2">
<h2>      &nb
sp;Pooja</h2>
<h2>      &nb
sp; 9977469946</h2>
</div>
<div id="b3">
<h2>      &nb
sp;Sheetal</h2>
<h2>      &nb
sp; 7081581466</h2>
</div>
<div id="b4">
39
<h2>      &nb
sp;Monika</h2>
<h2>      &nb
sp; 9565386679</h2>
</div>
<br><br><br><br><br><br>
<a href="https://www.facebook.com/"><img
src="images/over/fb.jpg" width="50px"
height="50px"/></a>
<a
href="https://accounts.google.com/ServiceLogin?
passive=1209600&continue=https%3A%2F
%2Faccounts.google.com
%2FManageAccount&followup=https%3A%2F
%2Faccounts.google.com
%2FManageAccount#identifier"><img
src="images/over/google.jpg" width="50px"
height="50px"/></a>
<a href="https://twitter.com/login"><img
src="images/over/tw.jpg" width="50px"
height="50px"/></a>
<a href="https://in.yahoo.com/"><img
src="images/over/yoo.png" width="50px"
height="50px"/></a>
</div>
</div>
</body>
</html>
40
Pyment.html PAGE
<!DOCTYPE>
<html>
<head>
<title>pay</title>
href="payment.css"/>
</head>
<body>
<div id="header">
<ul>
<li><a
</ul>
<div id="payment">
<h1>Payment Mode</h1>
<div id="a2">
<p> </p>
41

<label>Card
Type:</label>
<option value="debit">Debit Card</option>
<option
value="credit">Credit Card</option>
</select>
<br><br>
<label>Expirt Date:</label>
<select name="month">
<option>Jun</option>
<option>Feb</option>
<option>Mar</option>
<option>May</option>
<option>Jun</option>
<option>July</option>
<option>Aug</option>
<option>Sep</option>
<option>Oct</option>
<option>Nov</option>
<option>Dec</option>
</select>
<select name="year">
<option>2015</option><option>2016</option>
42
<option>2048</option><option>2049</
option><option>2050</option>
</select>
<br><br>
<label for="cardno">Card
No:</label>     &nb
sp;
<input id="caedno" name="num"
<label for="name">Card
Name:</label>
<input id="name" name="name"
placeholder="Name" required=""
43
<label for="password">CVV
No:</label>     &nb
sp;
<input id="password" name="cvv"
type="password"><br><br>
<label
for="password">
  Pin</label>
       &
nbsp;
<input id="password" name="password"
type="password"><br><br><br>

value="Ok" />
value="Reset" />
</form>
</div>
</div>
</div>
</body>
</html>
44
Menu.html PAGE
<!DOCTYPE html>

</head>
<body>
<div id="page">
<div id="header">
<div id="sidebar">
<a href="index.html" id="logo"><img
src="images/logo.png" alt="LOGO"></a>
<div id="navigation">
<ul>
<li>
<a
href="index.html">Home</a>
</li>
<li class="menu selected">
<a
href="menu.html">Menu</a>
<div class="sub">
<a
href="menu.html">Lorem Ipsum</a><a
href="menu.html" class="selected">Dolor Sit
Amet</a><a href="menu.html">Nulla
Pretium</a><a href="menu.html" class="last-
child">Curabitur</a>
</div>
46
<span></span>
</li>
</ul>
</div>
</div>
<div id="menu-adbox">
<div class="details">
<h1>Lorem ipsum</h1>
<p>
Lorem ipsum dolor sit amet,
consectetur adipiscing elit. Sed aliquet nulla ac
purus iaculis quis fermentum lacus sodales
</p>
</div>
</div>
</div>
<div id="contents">
<ul id="gallery">
<li>
<a href="menu.html"><img
src="images/sushi3.png" alt="Img"><b>Lorem
ipsum</b> Dolor sit amet</a>
</li>
<li>
</li>
<li>
47
</li>
<li>
</li>
<li>
</li>
<li>
</li>
<li>
</li>
<li>
</li>
<li>
48
</li>
<li>
</li>
<li>
</li>
<li>
</li>
</ul>
</div>
<div id="footer">
<div class="header">
<div class="body">
<ul>
<li>
<h4>Lorem
Ipsum</h4>
<span>> <a
href="#header">Dolor Sit
49
Amet</a></span><span>> <a
href="#header">Lorem
Ipsum</a></span><span>> <a
href="#header">Nulla Pretium</a></span>
</li>
<li>
<h4>Dolor Sit
Amet</h4>
<span>> <a
</li>
<li>
<h4>Nulla
Pretium</h4>
<span>> <a
</li>
<li class="last-child">
<h4>Curabitur</h4>
<span>> <a
50
</li>
</ul>
</div>
<div class="footer">
<div id="connect">
<a
href="http://freewebsitetemplates.com/go/facebook
/" target="_blank" class="facebook"></a><a
href="http://freewebsitetemplates.com/go/twitter/"
target="_blank" class="twitter"></a><a
href="http://freewebsitetemplates.com/go/googleplu
s/" target="_blank" class="googleplus"></a><a
href="http://freewebsitetemplates.com/go/vimeo/"
target="_blank" class="vimeo"></a>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
51
video.HTML PAGE
<!DOCTYPE html>
<html>
<head>
href="video.css"/>
href="dhtmlxcalendar.css"/>
<style>
#calendar,
#calendar2,
{
52
font-size: 12px;
}
</style>
<script>
var myCalendar;
function doOnLoad()
{
myCalendar = new
dhtmlXCalendarObject(["calendar","calendar2",]);
}
</script
</head>
<div id="header">
<ul>
<li><a
</ul>
<div id="ab">
<div id="check">
53
<br>
in:</label>
<input id="calendar" name="check in"
placeholder="2015/06/02" required=""
in:</label>
<input id="calendar2" name="check in"
placeholder="2015/06/02" required=""
</div>
Room Type:
<option
</select>
<option
</select>
<br><br>
54
       &
nbsp;
value="submit" />
value="Reset" />
</form>
</div>

<div id="chat">
       &
nbsp;
       &
nbsp;
       &
nbsp;
</form>
</div>
<br>
55
<br>
<div id="fd">
       &
nbsp;
       &
nbsp;
       &
nbsp;
</form>
</div>
</div>
<div id="video">
<video width="320" height="240" controls
autoplay>
<source src="123.mp4" type="video/mp4">
<source src="123.ogg" type="video/ogg">
</video>
</div>
<div id="rest">
56
<div id="a3">
</div>
<div id="b3">
<a href="#"></a>
</div>
<div id="c3">
</div>
</div>
</div>
</body>
</html>

Project Report 2

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

Project Report 2

Uploaded by

Copyright:

Available Formats

1

Hotel Management system

• In the management system, we will provide an app that can be used

• Customers can also give feedback through this app.

1.4 Additional Information

• Database Collection of all the information monitored by this system.

 Client side Technology : HTML, css

 40 GB Hard Disk Space

HTML Style Sheet

This will produce following result:

External Style Sheet

<p class="thick">This is thick</p>

<p class="green">This is green</p>

<p class="thick green">This is thick and green</p>

This will produce following result:

This is thick and green

Internal Style Sheet

<p class="thick">This is thick</p>

<p class="green">This is green</p>

<p class="thick green">This is thick and green</p>

This will produce following result:

This is thick and green

Inline Style Sheet

<p style="font-size:20px;">This is thick</p>

<p style="color:green;">This is green</p>

<p style="color:green;font-size:20px;">This is thick and green</p>

This will produce following result:

This is thick and green

The HTML <form> tag is used to create an HTML form and it has following

action Backend script ready to process your passed data.

method Method to be used to upload data. The most frequently used

 application/x-www-form-urlencoded - This is the

 mutlipart/form-data - This is used when you want to

HTML Form Controls

 Text Input Controls

 Radio Box Controls

 Select Box Controls

 File Select boxes

 Submit and Reset Button

Text Input Controls

 Password input controls - This is also a single-line text input but it

Single-line text input controls

This will produce following result:

size Allows to specify the width of the text-input control in terms

maxlength Allows to specify the maximum number of characters a user

Password input controls

This will produce following result:

size Allows to specify the width of the text-input control in terms

maxlength Allows to specify the maximum number of characters a user

Multiple-Line Text Input Controls

This will produce following result:

rows Indicates the number of rows of text area box.

cols Indicates the number of columns of text area box

This will produce following result:

value The value that will be used if the checkbox is selected.

checked Set to checked if you want to select it by default.

Radio Button Control

This will produce following result:

control it will be set to radio.

checked Set to checked if you want to select it by default.

Select Box Control

This will produce following result:

<label for="in">Check out:</label>