Indian Rivers

Rivers and Dams WEBSITE
CONTENTS
1. ACKNOWLEDGEMENT
2. SYNOPSIS
3. INTRODUCTION TO HTML
4. INTRODUCTION TO CSS
5. ABOUT THE PROJECT
6. HARDWARE AND SOFTWARE REQUIREMENT
7. SCREEN
8. CODING
9. CONCLUSION
10. BIBLIOGRAPHY
4th semester BCA, K.F.G.S.C, Tiptur. Page 1

ACKNOWLEDGEMENT
We express our grateful acknowledgement to our institution
KALPATARU FIRST GRADE SCIENCE COLLEGE, TIPTUR that provides us
an opportunity to fulfill our cherishing ambition of becoming Junior
Engineers in computer science.
We have great pleasure in expressing our deep sense of gratitude to our

Principal DR. A.M.SHIVANNA, KFGSC, Tiptur for having provided all the
facilities to work out this project.
We are grateful to our Head of the department, CSE, Mr. VINAY.M.S

for his unfailing encouragement, invaluable guidance and suggestion given to
us in the course of our project work.
We are also thankful to Mr. SHASHIDHAR.P.L, Lecturers, who have
helped us throughout this project with their invaluable guidance.
We are extremely thankful to the Entire staff AND

Mr. M.K.SHIVANANDA., instructor of computer science department for their
support in the completion of our project.
We are also thankful to Library staff for providing required reference

books throughout the completion of our Project.
Last, but certainly not the least we thank all our friends who have been
very helpful throughout the project with their invaluable suggestions at time
to time, and also like to thank all the teaching and non-teaching staff, for
their kind co-operation.

SYNOPSIS
Our project is “RIVERS & DAMES WEBSITE”. This project helps

to giving information about different Indian rivers and different Dam
places of India.
The project consists of a main webpage, which is divided into two

frames. Frame1 displays title, Frame2 displays the information about
Indian rivers and dams history & photo gallery.
The culture of India refers collectively to the thousands of distinct

and unique cultures of all religions and communities present in India.
India's languages, religions, dance, music, architecture, food, and
customs differ from place to place within the country. Indian culture
often labeled as an amalgamation of several cultures, spans across the
Indian subcontinent and has been influenced by a history that is
several millennia old. Many elements of India's diverse cultures, such
as Indian religions, philosophy, cuisine, languages, martial arts, dance,
music and movies have a profound impact across the Indosphere,
Greater India and the world.
The site displays Indian culture and its images. The project main
page contains main menu bar and its options
1. Home
2. River
3. Dams
4. Holy places
5. Economic imp
6. Disadvantage
7. Contact us

On clicking these options we enter into the page, which displays

the history and other particular details of that culture and its
details.
INTRODUCTION TO HTML
HTML stands for Hyper Text Mark-Up Language. It is a document-

layout and hyperlink-specification language. It defines the syntax and
placement of special, embedded direction that aren’t displayed by the
browser, but tell it how to display the content of the document,
including text, images, and other support media.
The language also tell you how to make a document interactive through
special hypertext links, which connect your documents-on either your
computer or someone else’s, as well as with other internet resources,
like FTP and gopher.
HTML is a language that is used to describe the structure of a webpage

has some common attribute like a heading, paragraph text, list bullets,
images, footers and a lot more. A webpage can have a specific style of
using these attributes. In a webpage, the text can be marked as header,
paragraph, list bullets or footer by using tags. Tags are used to mark a
block of text in a HTML page.
DOCUMENT STRUCTURE ELEMENTS
There are three HTML elements that form the basic document
structure of a webpage. These are:
HTML element
HEAD element
BODY element

HTML ELEMENTS:
The first document structure element in every HTML document is the HTML
tag. This tag indicates that the content of a file is in HTML.
This tag is mandatory.
HEAD ELEMENT:
The HEAD tag in a HTML document is used to give a title to the HTML
Page. It specifies that the contents between the opening and closing tags of
this element are a prologue to the rest of the document. This tag can contain
number of other tags.
BODY ELEMENT:
Other than the HTML and head tags, all other tags and the entire text of the
HTML page is placed within the BODY tag, as the name specifies, forms the
body of an HTML page . By using this tag can specify the background images
and colors, text color, and margins of the text in the HTML page.
Upper and lower case:
Elements name are case insensitive. Thus the horizontal rule element can be
written as any <hr>, <Hr> or <HR>.
Elements can have attributes:
Many elements can have arguments that pass parameters to the interpreter
handling these elements, these arguments are called attributes of the
elements. For example, consider the element

This element can have several attributes one of text is linked. To specify this
in the tag for A you write :
A=HREF=http://www.nrmotors.com/motors/motors.html>marked text </A>
Where the attributes HREF is assigned the indicated value. Note that the
element is not empty and that it is closed by the tags </A>. Note also that
ends tags never take attributes to an elements are always placed in the start
tag.
HTML ELEMENTS:
There are various HTML elements that can be used to construct an HTML
page. The HTML tag comprises of a left angular bracket or a less than symbol
(<) followed by the name of the tag and closed by a right angular bracket or a
greater than symbol(>). HTML elements can be categorized as:
 Container elements – A container element must have a starting and an

ending tag. The end tag is identical to the start tag except that it has a
slash that precedes the text within angular brackets. The document
text is placed between the start and end tags.
 Empty elements-
An empty element has only one tag. It does not contain any text.
Elements names are case insensitive. Thus, the horizontal rule element
can be written as any <hr><HR> or <Hr>.

ABOUT CSS
Cascading Style Sheets, fondly referred to as CSS, is a simple

design language intended to simplify the process of making web pages
presentable.
CSS handles the look and feel part of a web page. Using CSS, you
can control the color of the text, the style of fonts, the spacing between
paragraphs, how columns are sized and laid out, what background
images or colors are used, layout designs and variations in display for
different devices and screen sizes as well as a variety of other effects.
CSS is easy to learn and understand but it provides powerful

control over the presentation of an HTML document. Most commonly,
CSS is combined with the markup languages HTML or XHTML.
Advantages of CSS
CSS saves time − You can write CSS once and then reuse same
sheet in multiple HTML pages. You can define a style for each HTML
element and apply it to as many Web pages as you want.
Pages load faster − If you are using CSS, you do not need to write
HTML tag attributes every time. Just write one CSS rule of a tag and
apply it to all the occurrences of that tag. So less code means faster
download times.
Easy maintenance − To make a global change, simply change the

style, and all elements in all the web pages will be updated
automatically.

Superior styles to HTML − CSS has a much wider array of

attributes than HTML, so you can give a far better look to your HTML
page in comparison to HTML attributes.
Multiple Device Compatibility − Style sheets allow content to be

optimized for more than one type of device. By using the same HTML
document, different versions of a website can be presented for handheld
devices such as PDAs and cell phones or for printing.
Global web standards − Now HTML attributes are being

deprecated and it is being recommended to use CSS. So its a good idea
to start using CSS in all the HTML pages to make them compatible to
future browsers.
Offline Browsing − CSS can store web applications locally with the
help of an offline catche.Using of this, we can view offline websites.The
cache also ensures faster loading and better overall performance of the
website.
Platform Independence − The Script offer consistent platform

independence and can support latest browsers as well.
Basic Dropdown: Create a dropdown box that appears when the user moves
the mouse over an element.
Example
<style>
.dropdown
{
position: relative;
display: inline-block;
}
.dropdown-content
{
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;

box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);

padding: 12px 16px;
z-index: 1;
}
.dropdown:hover .dropdown-content
{
display: block;
}
</style>
ABOUT THE PROJECT
A website is a collection of Web pages, images, videos and

other digital assets that is hosted on one or several Web server, usually
accessible via the Internet, cell phone or a LAN.
The pages of websites can usually be accessed from a common

root URL called the homepage, and usually reside on the same physical
server. The URLs of the pages organize them into a hierarchy, although
the hyperlinks between them control how the reader perceives the
overall structure and how the traffic flows between the different parts of
the sites.
A website requires attractive design and proper arrangement of

links and images, which enables a browser to easily interpret and
access the properties of the site. Hence it provides the browser with
adequate information and functionality about the organization,
community, network etc.
The website has been developed for collecting the information

about Indian rivers and dams of different places in an effort to make it
as attractive as possible compared to the existing site.
The working of the project is as follows.

The first page provides several links. The Home page contains
several information about the site like home, dams, holy places,
economic importance, disadvantage and contact us etc.
In this project we add CSS coding to create a popup menu this is

very interactive and the graphics is good.
The main menu of this project is
This project gives the detail history of Indian dams and rivers they
are
GANGA RIVER
The ganaga is a transbondery river of the indian

subcontinent which flows through the nations of india and
bangladesh.The 2,525km river rises in the westren himalayas in

the Indian stateof uttarakhand,and flows south and east through

the gangetic plain of north india.
sources: Gangotri galacier, Nanda devi,Nanda kot,Satopanth
glacier, kedarnath, kamet,trisul.
Godavari River
The Godavari is India's second longest river after the ganga. Its
source is in the place triambakeshwar, mahharashtra.
Length:1,465km
Location: Brahmagiri mountain
KAVERI RIVER
The kaveri also reffered as
ponni, is an indian river flowing
through the states of karnataka and
tamli nadu orignating in foothills of
westren gards talakavre,kodagu in
karnataka. Amongest the river valles, the kaveri delta forms one of
most fertile region in the country.
Length: 805 km
Basin size: 31,334sq mi
Source: Talkavri, Kodagu.
Location: karnataka
KRISHNA RIVER

The krishna river is the fourth biggest river in terms of water

inflow and river basin area in
India,after the Ganga Godavari
and Brahmaputra.the river is also
called krishnaveni.
Length:1,400km
Basin size:99,980sq mi
Location:Satara district,Maharashtra.India
HARDWARE AND SOFTWARE REQUIREMENT
HARDWARE REQUIREMENT SPECIFICATION
PROCESSOR : DUAL CORE AND ABOVE
RAM : 2GB AND ABOVE
HARD DISK : 500 GB AND ABOVE
GENERAL INPUT AND OUTPUT DEVICE
SOFTWARE REQUIREMENT SPECIFICATION
OPERATING SYSTEM : WNDOWS XP AND ABOVE
EXPLORER : MOZILA FIREFOX , GOOGLE CROME

SOURCE CODE
Main page:
<!DOCTYPE html>
<html>
<!DOCTYPE html>
<html>
<!===============================================>
<head>
<title>xxxxxxxxxx</title>
<style>
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
li {
float: left;
}
li a, .dropbtn {
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover, .dropdown:hover .dropbtn {
background-color: red;
}
li.dropdown {
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}
.dropdown-content a {
color: black;
padding: 12px 16px;

text-decoration: none;
display: block;
text-align: left;
}
.dropdown-content a:hover {background-color: #f1f1f1}
.dropdown:hover .dropdown-content {
display: block;
}
</style>
</head>
<!
======================================================
========>
<body>
<img src="IMG-20190317-WA0007.jpg"width="1350"
height="200">
<ul>
<li><a href="HISTORY.HTML">Home</a>
<li class="dropdown">
<a href="names.html" class="dropbtn">Rivers </a>
<div class="dropdown-content">
<a href="ganga.html">Ganga</a>

<a href="yamuna.html">Yamuna</a>
<a href="brahma.html">Bramhaputra</a>
<a href="kavari.html">Kaveri</a>
<a href="indus.html">Indus</a>
<a href="godavari.html">Godavari</a>
<a href="narmada.html">Narmada</a>
<a href="mahanadi.html">Mahanadi</a>
<a href="krishna.html">Krishna</a>
<a href="tuga.html">Tungabhadra</a>
</div>
<li class="dropdown">
<a href="javascript:void(0)" class="dropbtn">Dams</a>
<div class="dropdown-content">
<a href="tehri.html">Tehri</a>
<a href="sardar.html">Sardar sarovar</a>
<a href="hirakhud.html">Hirakud</a>
<a href="nagarjuna.html">Nagarjunsagar</a>
<a href="krishnaraja.html">Krishnarajasagar</a>
<a href="mettur.html">Mettur</a>
<a href="bisalpur.html">Bisalpur</a>
<a href="koyna.html">Koyna</a>
<a href="maithon.html">Maithon</a>
</div>
<li><a href="holi places.html">Holi places</a>
<li><a href="eco imp.html">Economic imp</a>

<li><a href="DIS.HTML">Disadvantages</a>
<li><a href="Contact us.html">Contact us</a>
</li>
</ul>
</body>
</html>
<img src="PhotoGrid_1552483258733.jpg" height="420"
width="1350">
SCREENS




CONCLUSION
During this project, we learned more knowledge about HTML.

We learnt about designing a webpage and connecting them to form
a website. We implemented whatever we learnt about HTML
practically in this project.
This project will be more helpful for the education about

Indian rivers and dams since they can compare the various dam
places and its capacity to collect the water select the appropriate
model for them.
By the end of this project, we got an idea of how to implement

our ideas to develop the projects.

BIBLIOGRAPHY
 The HTML examples book by Edward farrar and Norman E

.Smith
 Application using the web by Edward farrar and Norman E
.Smith
 Web Programming building internet application by Chris
Bates
 from the web


Indian Rivers

Uploaded by

Copyright:

Available Formats

Indian Rivers

Uploaded by

Document Information

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

Indian Rivers

Uploaded by

Copyright:

Available Formats

Rivers and Dams WEBSITE

5. ABOUT THE PROJECT

6. HARDWARE AND SOFTWARE REQUIREMENT

4th semester BCA, K.F.G.S.C, Tiptur. Page 1

We have great pleasure in expressing our deep sense of gratitude to our

We are grateful to our Head of the department, CSE, Mr. VINAY.M.S

We are extremely thankful to the Entire staff AND

We are also thankful to Library staff for providing required reference

their kind co-operation.

4th semester BCA, K.F.G.S.C, Tiptur. Page 2

Our project is “RIVERS & DAMES WEBSITE”. This project helps

The project consists of a main webpage, which is divided into two

The culture of India refers collectively to the thousands of distinct

4th semester BCA, K.F.G.S.C, Tiptur. Page 3

On clicking these options we enter into the page, which displays

HTML stands for Hyper Text Mark-Up Language. It is a document-

HTML is a language that is used to describe the structure of a webpage

DOCUMENT STRUCTURE ELEMENTS

4th semester BCA, K.F.G.S.C, Tiptur. Page 4

This tag is mandatory.

Upper and lower case:

Elements can have attributes:

4th semester BCA, K.F.G.S.C, Tiptur. Page 5

A=HREF=http://www.nrmotors.com/motors/motors.html>marked text </A>

 Container elements – A container element must have a starting and an

4th semester BCA, K.F.G.S.C, Tiptur. Page 6

Cascading Style Sheets, fondly referred to as CSS, is a simple

CSS is easy to learn and understand but it provides powerful

Easy maintenance − To make a global change, simply change the

4th semester BCA, K.F.G.S.C, Tiptur. Page 7

Superior styles to HTML − CSS has a much wider array of

Multiple Device Compatibility − Style sheets allow content to be

Global web standards − Now HTML attributes are being

Platform Independence − The Script offer consistent platform

4th semester BCA, K.F.G.S.C, Tiptur. Page 8

box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);

ABOUT THE PROJECT

A website is a collection of Web pages, images, videos and

The pages of websites can usually be accessed from a common

A website requires attractive design and proper arrangement of

The website has been developed for collecting the information

The working of the project is as follows.

4th semester BCA, K.F.G.S.C, Tiptur. Page 9

In this project we add CSS coding to create a popup menu this is

The main menu of this project is

The ganaga is a transbondery river of the indian

4th semester BCA, K.F.G.S.C, Tiptur. Page 10

the Indian stateof uttarakhand,and flows south and east through

4th semester BCA, K.F.G.S.C, Tiptur. Page 11

The krishna river is the fourth biggest river in terms of water

HARDWARE AND SOFTWARE REQUIREMENT

HARDWARE REQUIREMENT SPECIFICATION

PROCESSOR : DUAL CORE AND ABOVE

RAM : 2GB AND ABOVE

HARD DISK : 500 GB AND ABOVE

GENERAL INPUT AND OUTPUT DEVICE

SOFTWARE REQUIREMENT SPECIFICATION

OPERATING SYSTEM : WNDOWS XP AND ABOVE

EXPLORER : MOZILA FIREFOX , GOOGLE CROME