JavaWeb：实验一JSP运行环境安装及配置

最新推荐文章于 2024-09-25 22:16:44 发布

OraOla

最新推荐文章于 2024-09-25 22:16:44 发布

阅读量389

点赞数 3

分类专栏： JavaWeb 文章标签：前端 javascript html

本文链接：https://blog.csdn.net/gyh3222719788/article/details/141751190

版权

JavaWeb 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

一、实验目的

1．掌握JSP程序运行环境配置的基本要求。

2．熟悉HTML的常用标签使用以及静态网页的制作。

二、实验性质

验证性实验

三、实验内容

制作一个静态网站的基本页面index.html，要求如下：

1．页面布局采用框架实现，页面布局及样式如图1所示。（20分）

图1 index.html页面布局

2．在页面的A部分显示显示“登录”和“注册”链接。单击“登录”链接，在C部分显示登录页面，登录页面包含一个HTML表单，页面参考样式如图2所示；单击“注册”链接，在C部分显示注册页面，注册页面也包含一个HTML表单，页面参考样式如图3所示。注册和登录页面可自行设计。（40分）

3．在页面的B部分显示一个链接，即网站作者的个人简介，单击该链接，能够在右边的C部分出现作者的个人简介信息。个人简介内容包括：个人基本信息（班级、学号、姓名等）、个人照片、个人简介信息等，请使用合理的HTML标签完成页面的设计。（30分）

index.html



<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <title>实验一</title>

</head>

<frameset rows="30%,70%">



    <frame src="top.html" noresize="noresize" name="top">



        <frameset cols="25%,75%">

            <frame src="left.html" noresize="noresize" name="left">

                <frame src="main.html" noresize="noresize" name="main">

        </frameset>



</frameset>



</html>

top.html



<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <title>top</title>

</head>



<body>

    <a href="login.html" target="main">登录</a>

    <a href="rigister.html" target="main">注册</a>

</body>



</html>



<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <title>登录页面</title>

</head>



<body>

    <div>

        <h2>登录页面</h2>

    </div>

    <form>

        <div>

           用户名：<br> <input type="text" placeholder="请输入用户名"><br><br>

        </div>

        <div>

           密码：<br> <input type="text" placeholder="请输入密码"><br><br>

        </div>

        <br> <input type="submit" value="登录">

    </form>

</body>



</html>

rigister.html

<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <title>注册</title>

</head>



<body>

    <div>

        <h2>登录页面</h2>

    </div>

    <div>用户名：<br>

    <input type="text">

    </div>

    <div>密码：<br>

    <input type="text"><br>

    </div>

    <div>

        性别：<br>

        <input type="radio" name="sex" checked>男

        <input type="radio" name="sex">女

    </div>

    <div>

        兴趣爱好：<br>

        <input type="checkbox">旅游

        <input type="checkbox">运动

        <input type="checkbox">美食

    </div>

    <div>

        <input type="submit" value="注册">

    </div>

</body>



</html>

left.html

<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <title>left</title>

</head>



<body>

    <a href="intro.html" target="main">个人简介</a>

  

</body>



</html>

intro.html

<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>



<body>

    oraola

</body>



</html>

main.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>显示</title>

</head>

<body>

    实验一

</body>

</html>