武汉理工大学软件开发工具实验报告..docxVIP

学生学号实验课成绩武汉理工大学学 生 实 验 报 告 书实验课程名称 软件开发工具开 课 学 院 计算机科学与技术学院 指导老师姓名 向广利 学 生 姓 名 学生专业班级 软件zy1302 2015 — 2016 学年 第 1 学期实验课程名称： 软件开发工具 实验项目名称基于框架的web前端设计实验成绩实验者专业班级软件zy1302组别同组者实验日期2015年11月10日第一部分：实验分析与设计（可加页）实验内容描述（问题域描述）内容：采用一种框架进行Web前端设计，内容自定义。实验设计（包括实验方案设计，实验手段的确定，实验步骤，实验过程等，用硬件逻辑或者算法描述 ）本次实验采用Bootstrap开源框架，Bootstrap框架属于UI框架，这个和jQuery不太一样，其实准确的描述Bootstrap框架属于css框架而非javascript框架，但是它本身也使用javascript来完善Bootstrap框架的视觉效果。此外，Bootstrap框架十分超前，在支持html5和css3的浏览器上表现特别好，而且对移动终端的浏览器支持也是相当优秀。本人借助官网给的demo，自己边学边做，完成了实验室管理系统的前端开发。其中用到了html5、css和javascript，由于是初学，还比较生疏，但是经过坚持不懈还是开发出来了。最后由于要用Java和后台交互，我还是把它改成了jsp，但是依然不影响它的呈现。主要仪器设备及耗材PC机第二部分：实验调试与结果分析（可加页）一、调试过程（包括调试方法描述、实验数据记录，实验现象记录，实验过程发现的问题等）源代码：（1）index.jsp :%@ page contentType=text/html;charset=UTF-8 language=java %!DOCTYPE htmlhtml lang=zhhead meta charset=utf-8 meta http-equiv=X-UA-Compatible content=IE=edge meta name=viewport content=width=device-width, initial-scale=1 title登录/title !-- Bootstrap core CSS -- link href=components/bootstrap/css/bootstrap.min.css rel=stylesheet !-- Custom styles for this template -- link href=assets/css/signin.css rel=stylesheet/headbody div class=container form class=form-signin action=/LoginServlet method=post %--这里可能要改跳转--% h2 class=form-signin-heading请登录/h2 label for=inputID class=sr-onlyID/label input type=number id=inputID name=id class=form-control placeholder=帐号 required autofocus label for=inputPassword class=sr-onlyPassword/label input type=password id=inputPassword name=password class=form-control placeholder=密码 required div class=checkbox label class=radio-inline input type=radio name=identity id=inlineRadio1 value=admin 管理员 /label label class=radio-inline input type=radio name=identity id=inlineRadio2 value=teacher 教师 /label label class=radio-inline input type=radio name=identity id=inlineRadio3 value=student 学生 /label /div button class=btn btn-lg btn-primary btn-block type=submit id=submitButton登录/button /form /div/body/html（2）其他源代码（见附件）二、实验结果及分析（包括结果描述、实验现象分析、影响因素