南昌大学实验报告
实验类型：□ 验证 □ 综合 □ 设计□ 创新  实验日期：2014/10实验成绩：
实验一 WEB 前端设计与制作
一、实验目的
1、掌握页面设计的基本技巧，了解网站的基本建立过程，掌握使用 Dreamweaver 制作
网页的基本技术；
2、学习和使用 HTML 语言，使用 CSS 控制页面样式，使用 JavaScript 脚本语言增强页
面的互动性。
二、实验内容
1、选择一个自己感兴趣的主题，明确站点风格和功能。
2、围绕这一主题设计站点页面，包括页面的布局、页面的彩搭配，页面的交互方式
等。
3、使用工具软件来完成设计页面的制作，运用到 HTML，CSS 和 JavaScript。
三、实验要求
1、了解站点风格的概念；
2、理解主页、栏目页、导航条、目录框架等术语；
3、熟悉 HTML 的常用标记使用以及框架网页的制作；
4、掌握使用Frontpage或者 Dreamweaver 制作网页的基本技术；
5、实验前应该先选定所要创建网站的主题（如：个人网站、自我推荐网站、班级网站、
某种专题网站等）和风格；
6、围绕主题和风格，设计站点的主页、栏目及其内容，并且设计出主页和栏目页面的
布局；
7、准备好网页制作时所需的资料以及图片等素材。
四、实验环境
硬件环境：PC 微机
软件环境：文本编辑器（UltraEdit、EditPlus、Notepad 等）或者Frontpage或者
Dreamweaver、IE 和FireFox浏览器（至少使用两种不同内核的浏览器）
五、实验代码
RequestForm.html
<!DOCTYPEhtml>
<html>
<head>
<title>用户注册</title>
   
<metaname="keywords"content="keyword1,keyword2,keyword3">
<metaname="description"content="this is my page">
<metaname="content-type"content="text/html; charset="gb2312">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
    <scripttype="text/javascript"src="Validator/Validator.js"></script>
    <scripttype="text/javascript"src="My97DatePicker/WdatePicker.js"></script>
   
</head>
<body>
<formaction="RequestDemo.jsp"method="post"onSubmit="return Validator.Validate('infoForm',3);">
        <h1align="center">注册用户</h1>
        <bodybgcolor="yellow">
        <tablealign="center">
            <tr>
                <td>用户名</td>
inputtypefile样式
                <td><inputtype="text"name="username"dataType="Require"msg="用户名是空的！"/></td>
            </tr>
            <tr>
                <td>密码</td>
                <td><inputtype="password"name="password"dataType="SafeString"msg="用户密码不安全！"id="userKey"/></td>
            </tr>
            <tr>
                <td>确认密码</td>
                <td><inputtype="password"name="repassword"value=""dataType="Repeat"to="userKey"msg="密码不一样！"/></td>
            </tr>
            <tr>
                <td>出生日期</td>
                <td><inputtype="text"name="Date"value=""onClick="WdatePicker();"dataType="Date"require="false"msg="Wrong Date Format"readonly="readonly"/>
            </tr>
            <tr>
                <td>性别</td>
                <td>
                    <inputtype="radio"name="sex"value="男"/>男
                    <inputtype="radio"name="sex"value="女"/>女
                </td>   
            </tr>
            <tr>
            <td>年级</td>
            <td>
           
                    <selectname="Degree"id="Degree">
                        <optionvalue="">无</option>
                        <optionvalue="大一">大一</option>
                        <optionvalue="大二">大二</option>
                        <optionvalue="大三">大三</option>
                        <optionvalue="大四">大四</option>
                    </select></td>
            </tr>
            <tr>
            <td>爱好</td>
            <td>
           
           
                    <inputtype="checkbox"name="Hobby"value="音乐"/>音乐
                    <inputtype="checkbox"name="Hobby"value="运动"/>运动
                    <inputtype="checkbox"name="Hobby"value="旅游"/>旅游
                    <inputtype="checkbox"name="Hobby"value="阅读"/>阅读
           
                </td>
           
            </tr>
            <tr>
            <td>上传头像</td>
            <td><inputtype="file"name="Photo"id="Photo"/>
            </td>
            </tr>
            <tr>
            <td>其他</td>
            <td><textareaname="other"rows="10"cols="50">输入信息</textarea></td>
            </tr>
            <tr>
                <td><inputtype="submit"value="注册"/></td>
                <td><inputtype="reset"value="重置"/></td>
            </tr>
        </table>
        </form>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。