Java, .NET, PHP, PYTHON, ANGULAR, .NET, ML, Data Scince, Testing, CI Tutorials in Easy Languages.

"Best Software Training, Internship, Project Development center of Indore India, Helpline 780506-3968"

Create Five Page Application in JSP,How to create five web page application using JSP

Create Five Page Application in JSP

1)  Create Dynamic Web Project Using Netbeans or  eclipse

2) Create header.jsp and footer.jsp page

3)  Create Five Different Pages

4)   Remove all default page content and include header and footer.jsp and create only different middle section as per requirement

5) Create CSS file and write properties of the header, footer, and middle section as per requirement.

6)  Create a menu using a hyperlink and integrate all JSP Web pages.

Complete Code:-

Code of header.jsp
<%--
    Document   : header.jsp
    Created on : Dec 5, 2019, 3:47:14 AM
    Author     : Hp
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
        <link href="style.css"  type="text/css" rel="stylesheet" />
    </head>
    <body>
        <header>
            <a href="home.jsp">Home</a>  <a href="about.jsp">About</a> <a href="contact.jsp">Contact</a>
        </header>
 

Code of  footer.jsp
<footer>
 
</footer>
    </body>
</html>

code of  home.jsp:-
<%@include  file="header.jsp" %>

<section>
    <h1>Welcome in home page</h1>
</section>

<%@include  file="footer.jsp" %>
................................................................................
code of about.jsp
.............................................
<%@include  file="header.jsp" %>

<section>
    <h1> Welcome in about us page </h1>
</section>

<%@include  file="footer.jsp" %>

..........................................................................................
Contact.jsp
..................................................................................................
<%@include  file="header.jsp" %>

<section>
    <h1> Welcome in contact us page </h1>
</section>

<%@include  file="footer.jsp" %>
..............................................................................
Create Style.css


header, footer
{
    height:100px;
    background-color: black;

}
header a
{
    color:white;
    margin-left:10px;
    text-decoration: none;
}
section
{
    height:500px;
    background-color: green;
}

*{
    margin:0px;
}






Post a Comment

If you have any doubt in programming or join online classes then you can contact us by comment .

Previous Post Next Post