Project Report of University Website

Internet is a global network that connects billions of

computers across the world with each other and to the World
Wide Web. It uses standard internet protocol suite (TCP/IP) to
connect billions of computer users worldwide. It is set up by using
cables such as optical fibers and other wireless and networking
technologies. At present, internet is the fastest mean of sending
or exchanging information and data between computers across
the world

The World Wide Web (also known as the Web) and the
Internet are fundamentally dissimilar from one another because
the Web is a collection of information that can be accessed using
the Internet, whereas the Internet is a global network of networks
that offers access to almost all types of information. In other
words, the Web is a service that was added to the Internet's
foundation.

o TCP/IP Network Model: The most popular protocols

for linking networks are Transmission Control Protocol (TCP)
and Internet Protocol (IP). Any communication is split up
into a number of packets that are sent from source to
destination.
Page - 1
 Project Report of University Website

o File Transfer Protocol: With the help of FTP (File

Transfer Protocol), a user can transfer documents, text files,
multimedia files, program files, etc., from one device to
another.

o Hypertext Transfer Protocol: It is used to

move a hypertext between two or more computers or other
devices. Links can be made using HTML tags and can take
the form of text or graphics.

IP addresses
There are various classifications of IP addresses, and each
category further contains some types.
Consumer IP addresses

Every individual or firm with an active internet service system

pursues two types of IP addresses, i.e., Private IP (Internet
Protocol) addresses and public IP (Internet Protocol) addresses.
The public and private correlate to the network area. Therefore, a
private IP address is practiced inside a network, whereas the
other (public IP address) is practiced outside a network.

Page - 2
 Project Report of University Website

Web Servers

Web pages are a collection of data, including images, text

files, hyperlinks, database files etc., all located on some
computer (also known as server space) on the Internet. A web
server is dedicated software that runs on the server-side. When
any user requests their web browser to run any web page, the
webserver places all the data materials together into an organized
web page and forwards them back to the web browser with the
help of the Internet. Therefore, we can conclude that: -

A web server is a dedicated computer responsible for

running websites sitting out on those computers somewhere on
the Internet. They are specialized programs that circulate web
pages as summoned by the user. The primary objective of any
web server is to collect, process and provide web pages to the
users.

Page - 3
 Project Report of University Website

This intercommunication of a web server with a web browser is

done with the help of a protocol

Page - 4
 Project Report of University Website

Introduction of the Project University Website:

The "University Website" has been developed to override the problems prevailing in the
practicing manual system. This software is supported to eliminate and in some cases
reduce the hardships faced by this existing system. Moreover this system is designed for
the particular need of the company to carry out operations in a smooth and effective
manner.

The application is reduced as much as possible to avoid errors while entering the data. It
also provides error message while entering invalid data. No formal knowledge is needed
for the user to use this system. Thus by this all it proves it is user-friendly. University
Website , as described above, can lead to error free, secure, reliable and fast
management system. It can assist the user to concentrate on their other activities rather
to concentrate on the record keeping. Thus it will help organization in better utilization of
resources.

Every organization, whether big or small, has challenges to overcome and managing the
information of Student, University, Course, Faculty, Fees. Every University Website has
different University needs, therefore we design exclusive employee management
systems that are adapted to your managerial requirements. This is designed to assist in
strategic planning, and will help you ensure that your organization is equipped with the
right level of information and details for your future goals. Also, for those busy executive
who are always on the go, our systems come with remote access features, which will
allow you to manage your workforce anytime, at all times. These systems will ultimately
allow you to better manage resources.

Page - 5
 Project Report of University Website

Abstract of the Project University Website:

The purpose of University Website is to automate the existing manual system by
the help of computerized equipments and full-fledged computer software, fulfilling their
requirements, so that their valuable data/information can be stored for a longer period
with easy accessing and manipulation of the same. The required software and hardware
are easily available and easy to work with.

University Website, as described above, can lead to error free, secure, reliable and
fast management system. It can assist the user to concentrate on their other activities
rather to concentrate on the record keeping. Thus it will help organization in better
utilization of resources. The organization can maintain computerized records without
redundant entries. That means that one need not be distracted by information that is not
relevant, while being able to reach the information.

The aim is to automate its existing manual system by the help of computerized
equipments and full-fledged computer software, fulfilling their requirements, so that their
valuable data/information can be stored for a longer period with easy accessing and
manipulation of the same. Basically the project describes how to manage for good
performance and better services for the clients.

Page - 6
 Project Report of University Website

Objective of Project on Unversity Website:

The main objective of the Project on University Website is to manage the details
of University, Student, Employee, Course, Fees. It manages all the information about
University, Faculty, Fees, University. The project is totally built at administrative end and
thus only the administrator is guaranteed the access. The purpose of the project is to
build an application program to reduce the manual work for managing the University,
Student, Faculty, Employee. It tracks all the details about the Employee, Course, Fees.

Functionalities provided by University Website are as follows:

• Provides the searching facilities based on various factors. Such as University,

Employee, Course, Fees
• University Website also manage the Faculty details online for Course details, Fees
details, University.
• It tracks all the information of Student, Faculty, Course etc
• Manage the information of Student
• Shows the information and description of the University, Employee
• To increase efficiency of managing the University, Student
• It deals with monitoring the information and transactions of Course.
• Manage the information of University
• Editing, adding and updating of Records is improved which results in proper resource
management of University data.
• Manage the information of Course
• Integration of all records of Fees.

Page - 7
 Project Report of University Website

Scope of the project University Website

It may help collecting perfect management in details. In a very short time, the
collection will be obvious, simple and sensible. It will help a person to know the
management of passed year perfectly and vividly. It also helps in current all works relative
to University Website. It will be also reduced the cost of collecting the management &
collection procedure will go on smoothly.

Our project aims at Business process automation, i.e. we have tried to computerize
various processes of University Website.

• In computer system the person has to fill the various forms & number of copies of
the forms can be easily generated at a time.
• In computer system, it is not necessary to create the manifest but we can directly
print it, which saves our time.
• To assist the staff in capturing the effort spent on their respective working areas.
• To utilize resources in an efficient manner by increasing their productivity through
automation.
• The system generates types of information that can be used for various purposes.
• It satisfy the user requirement
• Be easy to understand by the user and operator
• Be easy to operate
• Have a good user interface
• Be expandable
• Delivered on schedule within the budget.

Page - 8
 Project Report of University Website

Reports of University Website:

• It generates the report on University, Student, Faculty

• Provide filter reports on Employee, Course, Fees
• You can easily export PDF for the University,Faculty, Course
• Application also provides excel export for Student, Employee, Fees
• You can also export the report into csv format for University, Student, Fees

Modules of University Website:

• University Management Module: Used for managing the University details.

• Fees Module : Used for managing the details of Fees
• Faculty Module : Used for managing the details of Faculty
• Student Management Module: Used for managing the information and details of
the Student.
• Employee Module : Used for managing the Employee details
• Course Module : Used for managing the Course information
• Login Module: Used for managing the login details
• Users Module : Used for managing the users of the system

Page - 9
 Project Report of University Website

Input Data and Validation of Project on University Website

Existing System of University Website:

In the existing system the exams are done only manually but in proposed system we
have to computerize the exams using this application.
• Lack of security of data.
• More man power.
• Time consuming.
• Consumes large volume of pare work.
• Needs manual calculations.
• No direct role for the higher officials

Proposed System of University Website:

The aim of proposed system is to develop a system of improved facilities. The
proposed system can overcome all the limitations of the existing system. The system
provides proper security and reduces the manual work.
• Security of data.
• Ensure data accuracy’s.
• Proper control of the higher officials.
• Minimize manual data entry.
• Minimum time needed for the various processing.
• Greater efficiency.
• Better service.
• User friendliness and interactive.
• Minimum time required.

Page - 10
 Project Report of University Website

Data Dictionary:

This is normally represented as the data about data. It is also termed as metadata
some times which gives the data about the data stored in the database. It defines each
data term encountered during the analysis and design of a new system. Data elements
can describe files or the processes.

Following are some major symbols used in the data dictionary

• = equivalent to
• + and
• [] either/ or
• () Optional entry

Following are some rules, which defines the construction of data dictionary
entries:

1. Words should be defined to understand for what they need and not the
variable need by which they may be described in the program .
2. Each word must be unique. We cannot have two definition of the same client.
3. Aliases or synonyms are allowed when two or more enters shows the same
meaning. For example a vendor number may also be called as customer
number.
4. A self-defining word should not be decomposed. It means that the reduction
of any information in to subpart should be done only if it is really required that
is it is not easy to understand directly.
Data dictionary includes information such as the number of records in file, the
frequency a process will run, security factor like pass word which user must enter to
get excess to the information.

Page - 11
 Project Report of University Website

Screenshot of the
Project University
Website

Page - 12
 Project Report of University Website

HTML CODE { INDEX.html}

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>p1 university website</title>

<link rel="stylesheet" href="style.css">

<link rel="preconnect" href="https//fonts.gstatic.com">

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?

family=Poppins:ital,wght@100;200;300;,600;700;400&display=swap" >

<script src="https://kit.fontawesome.com/bcf3a80d2e.js" crossorigin="anonymous"></script>

</head>

<body>

<section class="header">

<nav>

<a href="index.html"><img src="images/logo3.png" ></a>

<div class="nav-links" id="navLinks">

<i class="fa fa-times" onclick="hidemenu()"></i>

<ul>

<li><a href="index.html">Home</a></li>

<li><a href="about.html">About</a></li>

<li><a href="course.html">cource</a></li>

Page - 13
 Project Report of University Website

<li><a href="blog.html">Blog</a></li>

<li><a href="contect.html">Contact</a></li>

</ul>

</div>

<i class="fa fa-bars" aria-hidden="true"onclick=showemenu()></i>

</nav>

<div class="text-box">

<h1>T.M.B.U. BHAGALPUR</h1>

<p>It will help you to reach your goal .making website is now one of the easiest thing in
the workd . you just need to learn HTML. <br>you just need to learn HTML ,css ,javascript.

</p>

<a href="" class="hero-btn">Visit us to know more</a>

</div>

</section>

<!--cource ------------>

<section class="course">

<h1>Courses we offer</h1>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, corporis</p>

<div class="row">

<div class="course-col">
Page - 14
 Project Report of University Website

<h3>Intermediate</h3>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nisi placeat maiores
debitis deserunt distinctio, perspiciatis nam nihil, animi vel sunt asperiores quia nostrum labore
architecto! Hic harum autem aliquid ducimus?</p>

</div>

<div class="course-col">

<h3>Degree</h3>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nisi placeat maiores
debitis deserunt distinctio, perspiciatis nam nihil, animi vel sunt asperiores quia nostrum labore
architecto! Hic harum autem aliquid ducimus?</p>

</div>

<div class="course-col">

<h3>Post Graduation</h3>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nisi placeat maiores
debitis deserunt distinctio, perspiciatis nam nihil, animi vel sunt asperiores quia nostrum labore
architecto! Hic harum autem aliquid ducimus?

</p>

</div>

</div>

</section>

<!-- campus ------------>

<section class="campus">

Page - 15
 Project Report of University Website

<h1>Our Campus</h1>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, corporis</p>

<div class="row">

<div class="campus-col">

<img src="images/london1.webp">

<div class="layer">

<h3>T.N.B.</h3>

</div>

</div>

<div class="campus-col">

<img src="images/tnb2.png">

<div class="layer">

<h3>MARWARI</h3>

</div>

</div>

<div class="campus-col">

<img src="images/newyork1.jpg">

<div class="layer">

<h3>G.B</h3>

</div>

</div>

</div>

Page - 16
 Project Report of University Website

</section>

<!----------facilities--------->

<section class="facilities">

<h1>Our Facilities</h1>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, corporis</p>

<div class="row">

<div class="facilities-col">

<img src="images/library.png" >

<h3>World class library</h3>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, corporis</p>

</div>

<div class="facilities-col">

<img src="images/basketball.png" >

<h3>Largest play Ground</h3>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, corporis</p>

</div>

<div class="facilities-col">

<img src="images/cafeteria.png" >

Page - 17
 Project Report of University Website

<h3>Tasty and Healthy food</h3>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, corporis</p>

</div>

</div>

</section>

<!-------- test imonials----------->

<section class="testimonials">

<h1>What our student says</h1>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, corporis</p>

<div class="row">

<div class="testimonials-col">

<img src="images/user1.jpg" >

<div>

<p>

Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eum nihil officiis id
assumenda natus rem, laboriosam cupiditate possimus voluptatibus facilis, numquam autem
molestias reprehenderit. Explicabo iusto distinctio facere nisi odit.

</p>

<h3>sagar prasar jha</h3>

Page - 18
 Project Report of University Website

<i class="fa fa-star" ></i>

<i class="fa fa-star" ></i>

<i class="fa fa-star" ></i>

<i class="fa fa-star" ></i>

<i class="fa fa-star-o" ></i>

</div>

</div>

<div class="testimonials-col">

<img src="images/user2.jpg" >

<div>

<p>

Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eum nihil officiis id assumenda
natus rem, laboriosam cupiditate possimus voluptatibus facilis, numquam autem molestias
reprehenderit. Explicabo iusto distinctio facere nisi odit.

</p>

<h3>Awadh kishor panday</h3>

<i class="fa fa-star" ></i>

<i class="fa fa-star" ></i>

<i class="fa fa-star" ></i>

<i class="fa fa-star" ></i>

<i class="fa fa-star-half-o" ></i>

</div>

</div>

Page - 19
 Project Report of University Website

</div>

</section>

<!----------call to action-->

<section class="cta">

<h1>Enroll for our various online cources <br>Anywhere from the world</h1>

<a href="" class="hero-btn">Contact Us</a>

</section>

<!----------footer------->

<section class="footer">

<h4>About Us</h4>

<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Adipisci pariatur laborum a
dignissimos aperiam sapiente perferendis fuga quam quis libero<br> ducimus dolore nam hic
natus, iure repellendus consectetur ab vel!

</p>

<div class="icon">

<i class="fa fa-facebook" ></i>

<i class="fa fa-instagram" ></i>

<i class="fa fa-twitter" ></i>

<i class="fa fa-linkedin" ></i>

</div>

<p>Made with <i class="fa fa-heart-o" ></i> by Kumar ADK </p>

Page - 20
 Project Report of University Website

</section>

<!--java script for toggle menu-->

<script>

var navLinks = document.getElementById ("navLinks");

function showemenu() {

navLinks.style.right = "0";

function hidemenu() {

navLinks.style.right = "-70px";

</script>

</body>

</html>

Page - 21
 Project Report of University Website

CSS CODE {style.css}

*{

margin: 0;

padding: 0;

font-family: 'Poppins', sans-serif;

body{

width: 100%;

height: 100%;

.header{

min-height: 100vh;

width: 100%;

background-image: linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url(images/banner.png);

background-position: center;

background-size: cover;

position: relative;

Page - 22
 Project Report of University Website

nav{

display: flex;

padding: 2% 6%;

justify-content: space-between;

align-items: center;

nav img{

width: 150px;

.nav links{

flex: 1;

text-align: right;

.nav-links ul li{

list-style: none;

display: inline-block;

padding: 8px 12px;

.nav-links ul li a{

color: #fff;

text-decoration: none;

Page - 23
 Project Report of University Website

font-size: 13px;

.nav-links ul li::after{

content: " ";

width: 0%;

height: 2px;

background: #f44336;

display: block;

margin: auto;

.nav-links ul li:hover::after{

width: 100%;

.text-box{

color: #fff;

position: absolute;

top: 40%;

left: 25%;

translate: translate(-50%,-50%);

text-align: center;

.text-box h1{

Page - 24
 Project Report of University Website

font-size: 62px;

text-align: center;

.text-box p{

margin: 10px 0 40px;

font-size: 14px;

color: #fff;

text-align: center;

.hero-btn{

display: inline-block;

text-decoration: none;

color: #fff;

border: 1px solid #fff;

padding: 12px 34px;

background: transparent;

position: relative;

cursor: pointer;

.hero-btn:hover{

border: 1px solid #f44336;

Page - 25
 Project Report of University Website

background: #f44336;

transition: 1s;

nav .fa{

display: none;

@media(max-width: 700px) {

.text-box{

top: 32%;

left: 5%;

.text-box h1{

font-size: 20px;

.nav-links ul li{

display: block;

.nav-links{

Page - 26
 Project Report of University Website

position: fixed;

background: #f44336;

height: 35vh;

width: 70px;

top: 0;

right: -70px;

text-align: right;

z-index: 2;

transition: 1s;

nav .fa{

display: block;

color: #fff;

margin: 5px;

font-size: 22px;

cursor: pointer;

.nav-links ul{

position: 30px;

Page - 27
 Project Report of University Website

/* cource------------*/

.course{

width: 80%;

margin: auto;

text-align: center;

padding-top: 100px;

h1{

font-size: 36px;

font-weight: 600;

p{

color: #777;

font-size: 14px;

font-weight: 300;

line-height: 22px;

padding: 10px;

.row{

margin-top: 5%;

Page - 28
 Project Report of University Website

display: flex;

justify-content: space-between;

.course-col{

flex-basis: 31%;

background: #ffd9d9;

border-radius: 10px;

margin-bottom: 5%;

padding: 20px 12px;

box-sizing: border-box;

transition: 0.5s;

h3{

text-align: center;

font-weight: 600;

margin: 10px 0;

.course-col:hover{

box-shadow: 0 0 20px rgba(0,0,0,0.5);

@media(max-width: 700px){

Page - 29
 Project Report of University Website

.row{

flex-direction: column;

/*-------------campus----------*/

.campus{

width: 80%;

margin: auto;

text-align: center;

padding-top: 50px;

.campus-col{

flex-basis: 32%;

border-radius: 10Px;

margin-bottom: 30px;

position: relative;

overflow: hidden;

Page - 30
 Project Report of University Website

.campus-col img{

width: 100%;

height: 100%;

position: relative;

display: block;

.layer{

padding: 5px;

background: transparent;

height: 100%;

width: 100%;

position: relative;

top: -102%;

left: 50;

transition: 0.5s;

.layer:hover{

background: rgba(226,0,0,0.7);

.layer h3{

width: 100%;

font-weight: 500;

color: #fff;

Page - 31
 Project Report of University Website

font-size: 26px;

bottom: 0;

left: 50%;

transform: translateX(-50%);

position: absolute;

opacity: 1;

transition: 0.5s;

.layer:hover h3{

bottom: 49%;

opacity: 1;

/*--------------facilities----------*/

.facilities{

width: 80%;

margin: auto;

text-align: center;

padding-top: 100px;

Page - 32
 Project Report of University Website

.facilities-col{

flex-basis: 31%;

border-radius: 10px;

margin-bottom: 5%;

text-align: center;

.facilities-col img{

width: 100%;

border-radius: 10px;

.facilities-col p{

padding: 0;

.facilities-col h3{

margin-top: 16px;

margin-bottom: 15px;

text-align: left;

Page - 33
 Project Report of University Website

/*-------- test imonials-----------*/

.testimonials{

width: 80%;

margin: auto;

padding-top: 100px;

text-align: center;

.testimonials-col{

flex-basis: 44%;

border-radius: 10px;

margin-bottom: 5%;

text-align: left;

background: #fff3f3;

padding: 25px;

cursor: pointer;

display: flex;

.testimonials-col img{

height: 40px;

margin-left: 5px;

Page - 34
 Project Report of University Website

margin-right: 30px;

border-radius: 50%;

.testimonials-col p{

margin-top: 15px;

text-align: left;

.testimonials-col fa{

color: #f44336;

@media(max-width: 700px){

.testimonials-col img{

margin-left: 0px;

margin-right: 15px;

/*------------call to action--------*/

Page - 35
 Project Report of University Website

.cta{

margin: 100px auto;

width: 80%;

background-image: linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)), url(images/banner2.jpg);

background-position: center;

background-size: cover;

border-radius: 10px;

text-align: center;

padding: 100px 0;

.cta h1{

color: #fff;

margin-bottom: 40px;

padding: 0;

@media(max-width: 700px){

.cta h1{

font-size: 24px;

Page - 36
 Project Report of University Website

<!----------footer------->

.footer{

width: 100%;

text-align: center;

padding: 30px 0;

.footer h4{

margin-bottom: 15px;

margin-top: 20px;

font-weight: 600;

text-align: center;

.footer p{

text-align: center;

margin-bottom: 25px;

.icon{

margin-left: 44%;

.icon .fa{

Page - 37
 Project Report of University Website

color: #f44336;

margin: 0 13px;

cursor: pointer;

padding: 18px 0;

@media(max-width: 700px){

.icon{

margin-left: 27%;

padding-right: 10%;

.fa-heart-o{

color: #f44336;

/* -----------------------------------about us page ---------------- */

.sub-header{

height: 50vh;

Page - 38
 Project Report of University Website

width: 100%;

background-image: linear-
gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url(images/background.jpg);

background-position: center;

background-size: cover;

color: #fff;

.sub-header h1{

text-align: center;

margin-top: 100px;

.about-us{

width: 80%;

margin: auto;

padding-top: 80px;

padding-bottom: 50px;

.about-col{

flex-basis: 48%;

padding: 30px 2px;

.about-col img{

width: 100%;
Page - 39
 Project Report of University Website

.about-col h1{

padding-top: 0;

.about-col p{

padding: 15px 0 25px;

.red-btn{

border: 1px solid #f44336;

background: transparent;

color: #f44336;

.red-btn:hover{

color: #fff;

/* -------------------------blog-conten------------------------- */

.blog-content{

width: 80%;

margin: auto;

padding: 60px 0;

Page - 40
 Project Report of University Website

.blog-left{

flex-basis: 65%;

.blog-left img{

width: 100%;

.blog-left h2{

color: #222;

font-weight: 600;

margin: 30px 0;

.blog-left p{

color: #999;

padding: 0;

.blog-right{

flex-basis: 32%;

Page - 41
 Project Report of University Website

.blog-right h3{

background: #f44336;

color: #fff;

padding: 7px 0;

font-size: 20px;

.blog-right div{

display: flex;

align-items: center;

justify-content: space-between;

padding: 8px;

box-sizing: border-box;

.comment-box{

border: 1px solid #ccc;

margin: 50px 0;

padding: 10px 20px;

.comment-box h3{

text-align: left;

.comment-form input, .comment-form textarea{

width: 100%;

Page - 42
 Project Report of University Website

padding: 10px;

margin: 15px 0;

box-sizing: border-box;

border: none;

outline: none;

background: #f0f0f0;

.comment-form button{

margin: 10px 0;

@media(max-width:700px){

.sub-header h1{

font-size: 24px;

/* ------------------contact us--------------------- */

.location{

width: 80%;

Page - 43
 Project Report of University Website

margin: auto;

padding: 80px 0;

.location iframe{

width: 100%;

.contact-us{

width: 80%;

margin: auto;

.contact-col{

flex-basis: 48%;

margin-bottom: 30px;

.contact-col div{

display: flex;

align-items: center;

margin-bottom: 40px;

.contact-col div .fa{

font-size: 28px;

color: #f44336;

Page - 44
 Project Report of University Website

margin: 10px;

margin-right: 30px;

.contact-col div p{

padding: 0%;

.contact-col div h5{

font-size: 20px;

margin-bottom: 5px;

color: #555;

font-weight: 400;

.contact-col input, .contact-col textarea{

width: 100%;

padding: 15px;

margin-bottom: 17px;

outline: none;

border: 1px solid #ccc;

box-sizing: border-box;

Page - 45
 Project Report of University Website

HTML CODE {about.html}

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>University Website Design</title>

<link rel="stylesheet" href="style.css">

<link rel="preconnect" href="https//fonts.gstatic.com">

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?

family=Poppins:ital,wght@100;200;300;,600;700;400&display=swap" >

<script src="https://kit.fontawesome.com/bcf3a80d2e.js" crossorigin="anonymous"></script>

</head>

<body>

Page - 46
 Project Report of University Website

<section class="sub-header">

<nav>

<a href="index.html"><img src="images/logo3.png" ></a>

<div class="nav-links" id="navLinks">

<i class="fa fa-times" onclick="hidemenu()"></i>

<ul>

<li><a href="index.html">Home</a></li>

<li><a href="about.html">About</a></li>

<li><a href="course.html">cource</a></li>

<li><a href="blog.html">Blog</a></li>

<li><a href="contect.html">Contact</a></li>

</ul>

</div>

<i class="fa fa-bars" aria-hidden="true"onclick=showemenu()></i>

</nav>

<h1>About Us</h1>

</section>

<!-- -----------------about us content----------- -->

<section class="about-us">

<div class="row">

<div class="about-col">

<h1>We are world largest University</h1>

Page - 47
 Project Report of University Website

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, in! Harum quo
maiores incidunt laborum rem temporibus, quia laudantium expedita officia perspiciatis sequi
tempora possimus, fugit pariatur non nesciunt quam.</p>

<a href="" class="hero-btn red-btn">EXPLORE NOW</a>

</div>

<div class="about-col">

<img src="images/about.jpg" alt="">

</div>

</section>

<!----------footer------->

<section class="footer">

<h4>About Us</h4>

<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Adipisci pariatur laborum a
dignissimos aperiam sapiente perferendis fuga quam quis libero<br> ducimus dolore nam hic
natus, iure repellendus consectetur ab vel!

</p>

<div class="icon">

<i class="fa fa-facebook" ></i>

<i class="fa fa-instagram" ></i>

<i class="fa fa-twitter" ></i>

<i class="fa fa-linkedin" ></i>

</div>

<p>Made with <i class="fa fa-heart-o" ></i> by Kumar ADK </p>

Page - 48
 Project Report of University Website

</section>

<!--java script for toggle menu-->

<script>

var navLinks = document.getElementById ("navLinks");

function showemenu() {

navLinks.style.right = "0";

function hidemenu() {

navLinks.style.right = "-70px";

</script>

</body>

</html>

Page - 49
 Project Report of University Website

HTML CODE {blog.html}

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>University Website Design</title>

<link rel="stylesheet" href="style.css">

<link rel="preconnect" href="https//fonts.gstatic.com">

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?

family=Poppins:ital,wght@100;200;300;,600;700;400&display=swap" >

<script src="https://kit.fontawesome.com/bcf3a80d2e.js" crossorigin="anonymous"></script>

</head>

<body>

<section class="sub-header">
Page - 50
 Project Report of University Website

<nav>

<a href="index.html"><img src="images/logo3.png" ></a>

<div class="nav-links" id="navLinks">

<i class="fa fa-times" onclick="hidemenu()"></i>

<ul>

<li><a href="index.html">Home</a></li>

<li><a href="about.html">About</a></li>

<li><a href="course.html">cource</a></li>

<li><a href="blog.html">Blog</a></li>

<li><a href="contect.html">Contact</a></li>

</ul>

</div>

<i class="fa fa-bars" aria-hidden="true"onclick=showemenu()></i>

</nav>

<h1>Our Certificates & Online Programs For 2024</h1>

</section>

<!-- --------------blog page -->

<section class="blog-content">

<div class="row">

<div class="blog-left">

<img src="images/certificate.jpg" >

<h2>Our Certificates & Online Programs For 2024</h2>

Page - 51
 Project Report of University Website

<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Inventore enim natus fugit
quidem, harum perferendis. Nostrum sint excepturi laborum harum labore rerum impedit
veniam nemo sunt? Officia totam qui deleniti?</p>

<br>

<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quasi ipsa tenetur
consequatur accusantium illo eaque sint, earum possimus reprehenderit rerum totam ex
voluptatibus incidunt, eveniet suscipit nostrum esse ea eligendi! Lorem ipsum dolor sit amet
consectetur adipisicing elit. Aut beatae officiis praesentium quos minima optio fugiat adipisci
odio quaerat assumenda fuga in quasi vero reiciendis nostrum possimus, harum ab
accusamus.</p>

<br>

<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Doloremque cumque ullam
nam itaque fuga ducimus repellat incidunt nulla sunt at consequuntur, labore nihil error
consectetur quisquam corrupti aliquid aperiam nisi!</p>

<br>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Laborum repudiandae
corporis dolore, laboriosam optio maiores deserunt obcaecati enim! Rerum animi temporibus
tempore dolore, fugit vitae sunt quibusdam facilis repellat doloribus.</p>

<div class="comment-box">

<h3>Leave a Comment</h3>

<form class="comment-form">

<input type="text" placeholder="Enter Name">

<input type="text" placeholder="Enter Email">

<textarea rows="5" placeholder="Your comment"></textarea>

<button type="submit" class="hero-btn red-btn">Post Comment</button>

</form>

</div>

Page - 52
 Project Report of University Website

</div>

<div class="blog-right">

<h3>Post Categories</h3>

<div>

<span>Busines Analytics</span>

<span>21</span>

</div>

<div>

<span>Data Science</span>

<span>15</span>

</div>

<div>

<span>Machine Learning</span>

<span>28</span>

</div>

<div>

<span>Computer Science</span>

<span>34</span>

</div>

<div>

<span>AutoCAD</span>

<span>42</span>

</div>

Page - 53
 Project Report of University Website

<div>

<span>Jornolism</span>

<span>32</span>

</div>

<div>

<span>Commerce</span>

<span>45</span>

</div>

</div>

</div>

</section>

<!----------footer------->

<section class="footer">

<h4>About Us</h4>

<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Adipisci pariatur laborum a
dignissimos aperiam sapiente perferendis fuga quam quis libero<br> ducimus dolore nam hic
natus, iure repellendus consectetur ab vel!

</p>

<div class="icon">

<i class="fa fa-facebook" ></i>

<i class="fa fa-instagram" ></i>

Page - 54
 Project Report of University Website

<i class="fa fa-twitter" ></i>

<i class="fa fa-linkedin" ></i>

</div>

<p>Made with <i class="fa fa-heart-o" ></i> by Kumar ADK </p>

</section>

<!--java script for toggle menu-->

<script>

var navLinks = document.getElementById ("navLinks");

function showemenu() {

navLinks.style.right = "0";

function hidemenu() {

navLinks.style.right = "-70px";

</script>

</body>

</html>

Page - 55
 Project Report of University Website

HTML CODE {contact.html}

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>University Website Design</title>

<link rel="stylesheet" href="style.css">

<link rel="preconnect" href="https//fonts.gstatic.com">

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?

family=Poppins:ital,wght@100;200;300;,600;700;400&display=swap" >

<script src="https://kit.fontawesome.com/bcf3a80d2e.js" crossorigin="anonymous"></script>

</head>

<body>

<section class="sub-header">

<nav>

<a href="index.html"><img src="images/logo3.png" ></a>

<div class="nav-links" id="navLinks">

<i class="fa fa-times" onclick="hidemenu()"></i>

<ul>

<li><a href="index.html">Home</a></li>

Page - 56
 Project Report of University Website

<li><a href="about.html">About</a></li>

<li><a href="course.html">cource</a></li>

<li><a href="blog.html">Blog</a></li>

<li><a href="contect.html">Contact</a></li>

</ul>

</div>

<i class="fa fa-bars" aria-hidden="true"onclick=showemenu()></i>

</nav>

<h1>Contact Us</h1>

</section>

<!-- ------------------contact us------------------ -->

<section class="location">

<iframe
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3608.6432813559054!2
d86.95308839678954!3d25.248937100000003!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m
3!1m2!1s0x39f04a742f137b4f%3A0xf7ae40a61d2c0a46!2sTilka%20Manjhi%20Bhagalpur%20U
niversity!5e0!3m2!1sen!2sin!4v1695726730059!5m2!1sen!2sin" width="600" height="450"
style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-
downgrade"></iframe>

</section>

Page - 57
 Project Report of University Website

<section class="contact-us">

<div class="row">

<div class="contact-col">

<div>

<i class="fa fa-home" ></i>

<span>

<h5>XYZ Road,ABC Buliding</h5>

<p>Bangalore, KArnatka IN</p>

</span>

</div>

<div>

<i class="fa fa-phone" ></i>

<span>

<h5>+91 7667768052</h5>

<p>Monday to Saturday, 10am to 6pm</p>

</span>

</div>

<div>

<i class="fa fa-envelope-o" ></i>

<span>

<h5>[email protected]</h5>

<p>Email us your query</p>

</span>

Page - 58
 Project Report of University Website

</div>

</div>

<div class="contact-col">

<form action="form handler.php" method="post">

<input type="text" name="name" placeholder="Enter your Name" required>

<input type="email" name="email" placeholder="Enter your Email address"

required>

<input type="text" name="Subject" placeholder="Enter your Subject" required>

<textarea rows="8" name="message" placeholder="Message"></textarea>

<button type="submit" class="hero-btn red-btn">Send Message</button>

</form>

</div>

</div>

</section>

<!----------footer------->

<section class="footer">

<h4>About Us</h4>

<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Adipisci pariatur laborum a
dignissimos aperiam sapiente perferendis fuga quam quis libero<br> ducimus dolore nam hic
natus, iure repellendus consectetur ab vel!

</p>

<div class="icon">

Page - 59
 Project Report of University Website

<i class="fa fa-facebook" ></i>

<i class="fa fa-instagram" ></i>

<i class="fa fa-twitter" ></i>

<i class="fa fa-linkedin" ></i>

</div>

<p>Made with <i class="fa fa-heart-o" ></i> by Kumar ADK </p>

</section>

<!--java script for toggle menu-->

<script>

var navLinks = document.getElementById ("navLinks");

function showemenu() {

navLinks.style.right = "0";

function hidemenu() {

navLinks.style.right = "-70px";

</script>

</body>

Page - 60
 Project Report of University Website

</html>

HTML CODE {course.html}

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>University Website Design</title>

<link rel="stylesheet" href="style.css">

<link rel="preconnect" href="https//fonts.gstatic.com">

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?

family=Poppins:ital,wght@100;200;300;,600;700;400&display=swap" >

<script src="https://kit.fontawesome.com/bcf3a80d2e.js" crossorigin="anonymous"></script>

</head>

<body>

<section class="sub-header">

<nav>

<a href="index.html"><img src="images/logo3.png" ></a>

<div class="nav-links" id="navLinks">

<i class="fa fa-times" onclick="hidemenu()"></i>

<ul>

<li><a href="index.html">Home</a></li>

Page - 61
 Project Report of University Website

<li><a href="about.html">About</a></li>

<li><a href="course.html">cource</a></li>

<li><a href="blog.html">Blog</a></li>

<li><a href="contect.html">Contact</a></li>

</ul>

</div>

<i class="fa fa-bars" aria-hidden="true"onclick=showemenu()></i>

</nav>

<h1>Our Courses</h1>

</section>

<!-- -----------------course----------- -->

<section class="course">

<h1>Courses we offer</h1>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, corporis</p>

<div class="row">

<div class="course-col">

<h3>Intermediate</h3>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nisi placeat maiores debitis
deserunt distinctio, perspiciatis nam nihil, animi vel sunt asperiores quia nostrum labore
architecto! Hic harum autem aliquid ducimus?</p>

</div>

<div class="course-col">

Page - 62
 Project Report of University Website

<h3>Degree</h3>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nisi placeat maiores debitis
deserunt distinctio, perspiciatis nam nihil, animi vel sunt asperiores quia nostrum labore
architecto! Hic harum autem aliquid ducimus?</p>

</div>

<div class="course-col">

<h3>Post Graduation</h3>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nisi placeat maiores
debitis deserunt distinctio, perspiciatis nam nihil, animi vel sunt asperiores quia nostrum labore
architecto! Hic harum autem aliquid ducimus?

</p>

</div>

</div>

</section>

<!----------facilities--------->

<section class="facilities">

<h1>Our Facilities</h1>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, corporis</p>

<div class="row">

<div class="facilities-col">
Page - 63
 Project Report of University Website

<img src="images/library.png" >

<h3>World class library</h3>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, corporis</p>

</div>

<div class="facilities-col">

<img src="images/basketball.png" >

<h3>Largest play Ground</h3>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, corporis</p>

</div>

<div class="facilities-col">

<img src="images/cafeteria.png" >

<h3>Tasty and Healthy food</h3>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, corporis</p>

</div>

</div>

</sect

Page - 64
 Project Report of University Website

<!----------footer------->

<section class="footer">

<h4>About Us</h4>

<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Adipisci pariatur laborum a
dignissimos aperiam sapiente perferendis fuga quam quis libero<br> ducimus dolore nam hic
natus, iure repellendus consectetur ab vel!

</p>

<div class="icon">

<i class="fa fa-facebook" ></i>

<i class="fa fa-instagram" ></i>

<i class="fa fa-twitter" ></i>

<i class="fa fa-linkedin" ></i>

</div>

<p>Made with <i class="fa fa-heart-o" ></i> by Kumar ADK </p>

</section>

<!--java script for toggle menu-->

<script>

var navLinks = document.getElementById ("navLinks");

function showemenu() {

navLinks.style.right = "0";

Page - 65
 Project Report of University Website

function hidemenu() {

navLinks.style.right = "-70px";

</script>

</body>

</html>

Page - 66
 Project Report of University Website

Conclusion of the Project University Website:

Our project is only a humble venture to satisfy the needs to manage their project
work. Several user friendly coding have also adopted. This package shall prove to be a
powerful package in satisfying all the requirements of the school. The objective of
software planning is to provide a frame work that enables the manger to make reasonable
estimates made within a limited time frame at the beginning of the software project and
should be updated regularly as the project progresses.

At the end it is concluded that we have made effort on following points…

• A description of the background and context of the project and its relation to work
already done in the area.
• Made statement of the aims and objectives of the project.
• The description of Purpose, Scope, and applicability.
• We define the problem on which we are working in the project.
• We describe the requirement Specifications of the system and the actions that can
be done on these things.
• We understand the problem domain and produce a model of the system, which
describes operations that can be performed on the system.
• We included features and operations in detail, including screen layouts.
• We designed user interface and security issues related to system.
• Finally the system is implemented and tested according to test cases

Page - 67