如何在网页中使用页眉和页脚

时间:2013-12-24 06:47:47

标签: css jsp

这是html中使用的页脚文件     footeradmin.jsp看你的页面好看

        <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
            pageEncoding="ISO-8859-1"%>
        <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
        <html>
        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <link href="<%=request.getContextPath()%>/css/style.css" rel="stylesheet" type="text/css">
         <script src="<%=request.getContextPath()%>/js/SpryCollapsiblePanel.js" type="text/javascript"></script>
        <script src="<%=request.getContextPath()%>/js/SpryMenuBar.js" type="text/javascript"></script>
        <link href="<%=request.getContextPath()%>/css/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
        <link href="<%=request.getContextPath()%>/css/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="tinybox.js"></script>
        </head>
        <body>        
        </div>
        </div>
        </div>
        </div>
        </div>
        </div>
        <div class="bottom">
        <ul>
          <li style="border-left: medium none;"><a href="nsephome.jsp">Home</a></li>
          <li><a href="aboutusadmin.jsp">About&nbsp;Us</a></li>
           <li><a href="Contactusadmin.jsp">Contact Us</a></li>
          <li><a href="feedbackadmin.jsp">Feedback</a></li>
          <li><a href="index.jsp">Logout</a></li>
           <li><a href="sitemapadmin.jsp">Site map</a></li>
        </ul>
        <p>Copyright &copy; 2013. Designed by <a>****</a></p>
        </div>
        </div>

        </body>
        </html>

这是我在网页中使用的头文件 headeradmin.jsp使用此文件来查看您的网页

        <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
            pageEncoding="ISO-8859-1"%>
        <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
        <html>
        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <title>Header</title>
         <script src="<%=request.getContextPath()%>/js/SpryCollapsiblePanel.js" type="text/javascript"></script>
        <script src="<%=request.getContextPath()%>/js/SpryMenuBar.js" type="text/javascript"></script>
        <link href="<%=request.getContextPath()%>/css/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
        <link href="<%=request.getContextPath()%>/css/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
        <link href="<%=request.getContextPath()%>/css/style2.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/tinybox.js"></script>
        <link href="<%=request.getContextPath()%>/css/tinystyle.css" rel="stylesheet" type="text/css" />
        </head>
        <body>
        <div class="main-out">
        <div class="main">
        <div class="page">
        <div class="top">
        <div class="header">
        <div class="header-top">
        <h1>National <span>Self Employment Program</span></h1>
        <p>Call Us: 987 3478 278</p>
        </div>
        <div class="topmenu">
        <ul>
         <li></li>
          <li><a href="nsephome.jsp">Home</a></li>
          <li><a href="aboutusadmin.jsp">About&nbsp;Us</a></li>
          <li><a href="Contactusadmin.jsp">Contact Us</a></li>
          <li><a href="feedbackadmin.jsp">Feedback</a></li>
          <li><a href="index.jsp">Logout</a></li>
        </ul>
        </div>
        <div style="height:550px; width:980px;margin-top:5px;">
        <div style="height:600px;width:160px;float:left;">
        <div style="width:160px;height:20px;background-color:#708090;float:left;"><FONT color="white"><center><b>Our Services</b></center></FONT></div>
        <%@include file="verticalbar1.jsp"%>
        </div>
        <div style="height:600px;width:20px;float:left;">
        </div>
        <div style="height:600px;width:800px;">

        </body>
        </html>

此页面包含在headerfile中 verticalbar1.jsp看你的页面不错

        <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
            pageEncoding="ISO-8859-1"%>
        <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
        <html>
        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <title>Insert title here</title>
        <link href="<%=request.getContextPath()%>/css/style.css" rel="stylesheet" type="text/css">
        <script src="<%=request.getContextPath()%>/js/SpryCollapsiblePanel.js" type="text/javascript"></script>
        <script src="<%=request.getContextPath()%>/js/SpryMenuBar.js" type="text/javascript"></script>
        <link href="<%=request.getContextPath()%>/css/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
        <link href="<%=request.getContextPath()%>/css/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
        <script src="<%=request.getContextPath()%>/js/bank.js" type="text/javascript"></script>
        <script type="text/javascript" src="tinybox.js"></script>
        </head>
        <body>
        <div id="CollapsiblePanel1" class="CollapsiblePanel" style="float:left;margin-top:5px;margin-bottom:10px;"> 
               <ul id="MenuBar1" class="MenuBarVertical">
                  <li><a  href="empregister.jsp">Create Employee</a>
                  </li>
                  <li><a  href="empupdate.jsp">Read Employee</a>
                   </li>
                    <li><a  href="employee_list.jsp">Employee List</a>
                  <li><a  href="empdelete.jsp">Delete Employee</a>

                  </li>
                  <li><a href="feed1.jsp">Feedbacks</a>
                  </li>
                  <li><a class="MenuBarItemSubmenu" href="#">Opinion poll</a>
                    <ul>
                      <li><a href="SubmitQuestion.jsp" >Post Question</a>
                      </li>
                      <li><a href="showpolling.jsp" >View Opinions</a>
                      </li>
                      </ul></li>

                </ul>

              </div> 
        <script type="text/javascript">
             <!--
        var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1", {contentIsOpen:false});
        var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgRight:"../../../SpryAssets/SpryMenuBarRightHover.gif"});
        //-->
        </script>
        <center>
        <img src="../images/emp2.JPG" alt="emp1" width="170" height="200"></img></center>

        </body>
        </html>

2 个答案:

答案 0 :(得分:2)

当JSP页面执行时,将处理jsp:include元素。 include操作允许您在JSP文件中包含静态或动态资源。包含静态和动态资源的结果是完全不同的。如果资源是静态的,则将其内容插入到调用JSP文件中。如果资源是动态的,则将请求发送到包含的资源,执行包含的页面,然后结果包含在调用JSP页面的响应中。
jsp:include元素的语法是:

<jsp:include page="includedPage" />

您可以在hearder.jsp

中加入footer.jspverticalbar1.jsp
..........
.........
<jsp:include page="header.jsp" />
.........
........
.....
<jsp:include page="footer.jsp" />  

相关链接

答案 1 :(得分:1)

你应该尝试使用:

<jsp:include page="..." />

将您想要的页面包含在“正文内容”页面的顶部和底部的页脚中。