Web基础实训报告
目录
一、实训简介........................................ 错误!未定义书签。
二、实训内容........................................ 错误!未定义书签。
1、HTML ......................................... 错误!未定义书签。
2、CSS .......................................... 错误!未定义书签。
3、JavaScript ................................... 错误!未定义书签。
4、jQuery ....................................... 错误!未定义书签。
5、jQuery easyUI ................................ 错误!未定义书签。
6、jQuery easyUI的基本插件...................... 错误!未定义书签。
（1）基本插件................................ 错误!未定义书签。
（2）布局管理器.............................. 错误!未定义书签。
（3）菜单和按钮.............................. 错误!未定义书签。
（4）表单.................................... 错误!未定义书签。
（5）窗口.................................... 错误!未定义书签。
（6）数据表格和树形菜单...................... 错误!未定义书签。
三、实训过程........................................ 错误!未定义书签。
1、实训......................................... 错误!未定义书签。
（1）内容.................................... 错误!未定义书签。
（2）目的.................................... 错误!未定义书签。
2、实践......................................... 错误!未定义书签。
（1）制定网站主题............................ 错误!未定义书签。
（2）网站简介................................ 错误!未定义书签。
（3）收集素材................................ 错误!未定义书签。
（4）网站规划................................ 错误!未定义书签。
（5）网站制作................................ 错误!未定义书签。
（6）网站测试................................ 错误!未定义书签。
3、编写文档..................................... 错误!未定义书签。
四、实训总结........................................ 错误!未定义书签。
一、实训简介
Web本意是蜘蛛网和网的意思。在这个遍布网络的世界里，Web网络成为不可或缺并且极其重要的一部分。Web功能强大，其内容包括存储在世界各地Internet计算机中的大量文档的集合。Internet将海量的信息以某种关联的文档形式组织在一起，每一个文档将会以主页的形式展现，这些主页是一种超文本信息，通过超链接进行连接。
Web标准并不是一个单一的标准，而是一个系列的标准的集合。Web标准中具有代表性的几种语言有：XML可扩展标记语言、XHTML可扩展超文本标记语言、CSS层叠样式表、DOM 文档对象模型、JavaScript脚本程序设计语言等。
本次实训主要是学习jQurey，它是一个优秀的JavaScript框架，是轻量级的js库，它兼容CSS3，还兼容各种浏览器（IE +, FF +, Safari +, Opera +）。jQuery使用户能更方便地处理HTML documents、events、实现动画效果，并且方便地为网站提供AJAX交互。
本次实训的目的是通过对JavaScript的学习，学会使用HTML标记语言，通过CSS对页面的布局，在HTML基础上，使用JavaScript开发交互式动态Web网页。能够熟练使用JavaScript语言和jQurey对网页界面实现动画效果，让网页能够动态显示，美观大方。
二、实训内容
1、HTML
HTML是超文本标记语言，互联网传输的标准语言。HTML具有很大的兼容性，例如
2、CSS
CSS是层叠样式表的简称。为了弥补HTML在显示属性上的不足，W3C协会制定了这一套扩展样式标准。CSS标准中重新定义了HTML中原来的文字显示样式，并增加了新的概念，例如类、层等，还可以对文字进行重叠、定位等操作。它提供了更为丰富多彩的样式；同时CSS可集中进行样式管理。另外，CSS允许将样式定义单独存储于样式文件中，这样就可以进行样式管理，不仅便于样式管理，还可以在多个HTML文件共享样式定义。一个HTML文件
允许引用多个不同的CSS样式文件中的样式定义。在网页制作时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制
3、JavaScript
在HTML基础上，使用JavaScript可以开发交互式动态Web网页
4、jQuery
jQuery是一个优秀的Javascript框架。它是轻量级的js库，它兼容CSS3，还兼容各种浏览器（IE +, FF +, Safari +, Opera +）。jQuery使用户能更方便地处理HTML documents、events、实现动画效果，并且方便地为网站提供AJAX交互。
jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。jQuery能够使用户的html页面保持代码和html内容分离，也就是说，不用再在html里面插入一堆js来调用命令了，只需定义id即可
5、jQuery easyUI
easyui是一个基于jquery的集成了各种用户界面的插件。
使用easyui不需要写太多javascript代码，一般情况下只需要使用一些html标记来定义用户接口。
easyui非常简单，但是功能非常强大
6、jQuery easyUI的基本插件
（1）基本插件
简单载入器-easyloader
使用方法：
一般拖动-draggable 使用方法：
脚本语言：
拖动至容器-droppable 使用方法：
脚本语言：
缩放-resizable
使用方法：
脚本语言：
分页-pagination
使用方法：
脚本语言：
搜索框-searchbox
使用方法：
脚本语言：
进度条-progressbar 使用方法：
脚本语言：
（2）布局管理器
控制面板-panel
选项卡-tabs
可伸缩面板-accordion 布局面板-layout
（3）菜单和按钮
菜单-menu
链接按钮- linkbutton
菜单按钮- menubutton
分隔按钮- splitbutton
（4）表单
表单- form
表单验证- validatebox
自定义组合框- combo
可装载组合框- combobox
组合树- combotree
组合表格- combogrid
数字验证框- numberbox
日期组合框- datebox
日期时间组合框- datetimebox 日历- calendar
调节器- spinner
数字调节器- numberspinner 时间调节器- timespinner
（5）窗口
窗口- window
对话窗口- dialog
消息窗口- messager
（6）数据表格和树形菜单
数据表格- datagrid
属性表格- propertygrid
树形菜单- tree
树形表格- treegrid
三、实训过程
1、实训
老师给我们讲解了本次实训的主要内容和实训目的
（1）内容
学习jQurey，它是一个优秀的JavaScript框架，是轻量级的js库，它兼容CSS3，还兼容各种浏览器（IE +, FF +, Safari +, Opera +）。jQuery使用户能更方便地处理HTML documents、events、实现动画效果，并且方便地为网站提供AJAX交互。
（2）目的
通过对JavaScript的学习，学会使用HTML标记语言，通过CSS对页面的布局，在HTML 基础上，使用JavaScript开发交互式动态Web网页。
2、实践
每个人自己设计一个动态网站，使用HTML编写网页、CSS布局、jQurey实现动态效果。
（1）制定网站主题
网站主题——健康生活品质享受
主要是以绿色环保，时尚品质为主题，倡导人们健康生活。
（2）网站简介
在本网站中，可以浏览到各种精品家居用品、绿色食品、健康养生、低碳环保等内容。在该网站中，可以注册成为我们的会员，享受精品家居、绿色食品优惠；可以浏览健康养生内容，上传养生心得；学习低碳生活，绿色环保等。
（3）收集素材
在网上收集了有关绿色环保，品质家居等相关的文字、图片、动画等素材。
（4）网站规划
本网站是由一个主页和多个子网页组成。主页和子页都采用CSS布局，主页和子页中设有超链接，可以在各个网页中自由切换。
（5）网站制作
使用Dreamweaver 8和Macromedia Fireworks 8进行网站制作和图片修改。
（6）网站测试
将制作好的网站运行在浏览器上，检查预期功能是否实现。
3、编写文档
对实训过程编写《实训报告》。
对设计的网站编写《网站设计报告》
四、实训总结
通过这次网页课程设计激发学习兴趣，调动学习的自觉性，自己动脑、动手，动口，运用网络资源，结合教材及老师的指导，通过自身的实践，创作出积聚个人风格、个性的网页。
总体来说，整个网页制作的过程，我学会了很多知识，
在设计网页的这几天里，我充分利用了这次设计的机会，全心全意投入到网页世界，去不断的学习，去不断的探索；同时去不断的充实，去不断的完善自我，在网络的天空下逐渐的美化自己的人生！
做好页面，并不是一件容易的事，它包括主页的选题、内容采集整理、图片的处理、页面的排版设置、背景及其整套网页的色调等很多东西。本次课程设计不是很好，页面过于简单，创新意识反面薄弱，这是我需要提高的地方。需要学的地方还有很多，需要有耐心、坚持，不断的学习，综合运用多种知识，才能设计出好的web页面。
总体来说，通过这次的对网页课程设计，有收获也有遗憾、不足的地方，但我想，我已经迈入了网页设计的大门，只要我再认真努力的去学习，去提高，凭借我对网页设计的热情和执着，我将来设计出的网页会更加专业，更完善。