zoukankan      html  css  js  c++  java
  • HTML 导航框架

    首页效果图

      

    点击链接一效果图

      

     代码结构

      

    index.jsp

      

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>frameset</title>
        <link href="logo.ico" rel="shortcut icon" type="image/x-icon" />
      </head>
      <frameset rows="25%,50%,25%" cols="*">
          <frame src="top.jsp"/>
          <frameset rows="*" cols="25%,75%">
              <frame src="left.jsp"/>
              <frame src="right.jsp" name="showframe"/>
          </frameset>
          <frame src="bottom.jsp"/>
      </frameset>
    </html>

    top.jsp

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>top</title>
        <link href="logo.ico" rel="shortcut icon" type="image/x-icon" />
      </head>
      <body>
          top...
      </body>
    </html>

    left.jsp

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>left</title>
        <link href="logo.ico" rel="shortcut icon" type="image/x-icon" />
      </head>
      <body>
          <a href="link1.jsp" target="showframe">链接一</a><br/>
          <a href="link2.jsp" target="showframe">链接一</a><br/>
          <a href="link3.jsp" target="showframe">链接一</a>
      </body>
    </html>

    right.jsp

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>right</title>
        <link href="logo.ico" rel="shortcut icon" type="image/x-icon" />
      </head>
      <body>
          welcome...
      </body>
    </html>

    bottom.jsp

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>bottom</title>
        <link href="logo.ico" rel="shortcut icon" type="image/x-icon" />
      </head>
      <body>
          bottom...
      </body>
    </html>

    link1.jsp

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>link1</title>
        <link href="logo.ico" rel="shortcut icon" type="image/x-icon" />
      </head>
      <body>
          link1...
      </body>
    </html>

    link2.jsp

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>link2</title>
        <link href="logo.ico" rel="shortcut icon" type="image/x-icon" />
      </head>
      <body>
          link2...
      </body>
    </html>

    link3.jsp

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>link3</title>
        <link href="logo.ico" rel="shortcut icon" type="image/x-icon" />
      </head>
      <body>
          link3...
      </body>
    </html>
  • 相关阅读:
    软件工程14—第09组 Beta冲刺(2/4)
    软件工程13—第09组 Beta冲刺(1/4)
    软件工程12—第09组 Alpha事后诸葛
    软件工程11—第09组 Alpha冲刺(4/4)
    软件工程10—第09组 Alpha冲刺(3/4)
    软件工程09—第09组 Alpha冲刺(2/4)
    软件工程08—第09组 Alpha冲刺(1/4)
    软件工程07—第09组 团队Git现场编程实战
    软件工程06—亚瑟王の十三水2.0
    第06组 Alpha冲刺(4/6)
  • 原文地址:https://www.cnblogs.com/zhuwenqi2016/p/6099606.html
Copyright © 2011-2022 走看看