web开发实训报告
web实训报告

web实训报告一、引言Web实训是大学计算机科学专业的一门重要课程,旨在培养学生的Web开发能力。
通过实践项目,学生能够掌握HTML、CSS、JavaScript等前端技术,以及后端开发、数据库设计等相关知识。
本文将对我在Web实训中的学习、实践和收获进行总结和分享。
二、项目选择与设计在Web实训的开始阶段,我们小组首先选择了我们感兴趣的项目主题。
经过讨论和调研,我们决定开发一个在线购物网站。
我们设计了网站的整体结构和功能,包括用户注册、商品浏览、购物车、订单管理等模块,并确定了所使用的技术栈和开发工具。
三、前端开发在前端开发阶段,我们主要使用HTML、CSS和JavaScript来实现网站的用户界面和交互。
我们按照设计稿进行页面的切图和布局,并运用CSS样式美化页面。
同时,我们使用JavaScript编写了一些动态效果,如轮播图、下拉菜单等,以提升用户体验。
通过这个阶段的实践,我对前端开发有了更深入的了解,并学会了如何兼顾用户界面的美观和交互的友好性。
四、后端开发在后端开发阶段,我们使用了一种流行的开发框架来实现网站的功能。
我们选择了Node.js作为后端开发语言,并使用Express框架搭建了服务器。
同时,我们还使用了MySQL数据库来存储用户信息、商品信息等数据。
通过这个阶段的实践,我学会了如何搭建后端服务器,处理HTTP请求和响应,并与数据库进行交互。
这些技能对于我未来的职业发展具有重要意义。
五、项目测试与优化在项目开发完成后,我们进行了一系列的测试和优化工作。
我们对网站的功能进行了全面的测试,确保用户可以正常使用各个模块。
同时,我们还进行了性能优化,如对数据库进行索引优化、对前端代码进行压缩等,以提升网站的响应速度和用户体验。
通过这个阶段的实践,我了解了如何进行软件测试和性能优化,并明白了这些工作对于项目的成功至关重要。
六、项目总结与反思通过这次Web实训项目,我不仅学到了许多专业知识和技能,还培养了团队合作和解决问题的能力。
Web开发实训课程学习总结

Web开发实训课程学习总结在本学期的Web开发实训课程中,我收获了许多有价值的知识和经验。
通过实践项目,我深入了解了Web开发的整个过程以及相关的技术和工具。
在本文中,我将就我在课程中学到的主要内容进行总结和回顾。
一、课程内容回顾1. 基础知识学习在课程一开始,我们首先对Web开发的基础知识进行了学习。
包括HTML、CSS和JavaScript等前端基础技术,以及后端的PHP和MySQL等相关知识。
通过理论的学习,我们对Web开发的整体框架和工作原理有了初步的了解。
2. 实践项目在课程的后期,我们开始了一系列的实践项目,这让我更好地应用所学知识并提升自己的实际操作能力。
我们开发了一个简单的博客系统,并尝试了不同的设计和功能,例如用户注册和登录、文章发表和查看、评论功能等等。
通过实践,我加深了对Web开发各个环节的理解,并且学会了如何解决实际项目中遇到的问题。
二、遇到的挑战与解决方案在学习过程中,我也遇到了一些挑战和困难。
比如说,我在开始实践项目时,对如何组织代码结构和管理文件有些不清晰,导致后期维护起来比较困难。
为了解决这个问题,我在项目开始前先进行详细的规划和设计,明确每个功能模块的职责和相互关系,这样有助于提高代码的可维护性。
此外,在开发过程中,我也遇到了一些技术难题。
例如,当我想要实现一个动态加载数据的功能时,面临着数据的异步获取和展示的问题。
通过查阅相关资料和向同学请教,我学会了使用Ajax技术来解决数据异步加载的需求,从而提升了用户的浏览体验。
三、收获与感悟通过参加本次Web开发实训课程,我获得了许多宝贵的经验和技能。
首先,我对Web开发的整体流程和各个环节有了更深入的理解,知道了如何通过前后端的协作来实现一个完整的Web应用。
其次,我在实践中学会了如何解决问题和调试代码,这对我以后的工作和学习都有很大的帮助。
此外,课程中的团队合作项目也让我深刻体会到了团队合作的重要性和价值。
我们在项目中共同努力,互相帮助和支持,才顺利完成了项目的开发和部署。
web开发实习报告

web开发实习报告【Introduction】回首时间,实习的几个月仿佛只是片刻。
在这段时间里,我有幸踏入了Web开发的大门,亲身体验了这个领域的魅力与挑战。
本篇报告将为大家介绍我的Web开发实习经历,包括我所参与的项目、所学到的技能以及遇到的挑战和收获。
【项目一:响应式网站开发】在实习的初期,我被安排参与了一个响应式网站开发项目。
这个项目要求我们根据客户要求创建一个适配不同屏幕大小的网站。
在准备阶段,我和团队成员进行了详细的需求调研,并确定了所需的技术栈。
接下来,我们着手设计网站的用户界面和交互逻辑,并进行了多次迭代和改进。
通过参与这个项目,我不仅深入了解了HTML、CSS和JavaScript等前端开发的基础知识,还学会了如何写出优雅、简洁而又高效的前端代码。
【项目二:后端开发与数据库设计】在接触过前端开发后,我开始逐渐对后端开发产生了浓厚的兴趣。
在随后的实习中,我有幸参与了一个后端开发与数据库设计的项目。
这个项目要求我们创建一个支持用户注册、登录和信息管理的系统。
在这个过程中,我深入理解了Web应用的工作原理,学会了使用后端框架进行逻辑处理,并熟练运用了SQL语言进行数据库设计和操作。
这个项目为我提供了一个综合应用前后端知识的机会,使我对整个Web开发过程有了更加清晰的认识。
【挑战与收获】在实习的过程中,我也遇到了一些挑战。
最大的挑战之一是与团队协作。
在项目中,我不仅与其他开发者密切合作,还需要与产品经理和设计师保持良好的沟通。
通过这个团队合作的过程,我学会了如何协调不同角色之间的利益,提高了沟通和协作能力。
另一个挑战是在面对技术难题时保持耐心和解决问题的能力。
在开发过程中,我遇到过一些困难,但通过不断学习和尝试,我成功地克服了这些难题,并从中获得了巨大的满足感。
在这段实习经历中,我不仅学到了专业知识和技能,还培养了自我管理和团队合作的能力。
通过参与实际项目,我深刻体验到了Web开发的创造力和挑战性。
web实训报告

web实训报告web实训报告集合9篇随着社会不断地进步,报告的适用范围越来越广泛,不同种类的报告具有不同的用途。
那么什么样的报告才是有效的呢?以下是店铺整理的web实训报告,希望能够帮助到大家。
web实训报告1从那里,我学会了下面几点找工作的心态:一、继续学习,不断提升理论涵养。
在信息时代,学习是不断地汲取新信息,获得事业进步的动力。
作为一名青年学子更就应把学习作为持续工作用心性的重要途径。
走上工作岗位后,我会用心响应单位号召,结合工作实际,不断学习理论、业务知识和社会知识,用先进的理论武装头脑,用精良的业务知识提升潜力,以广博的社会知识拓展视野。
二、努力实践,自觉进行主角转化。
只有将理论付诸于实践才能实现理论自身的价值,也只有将理论付诸于实践才能使理论得以检验。
同样,一个人的价值也是透过实践活动来实现的,也只有透过实践才能锻炼人的品质,彰显人的意志。
务必在实际的工作和生活中潜心体会,并自觉的进行这种主角的转换。
三、提高工作用心性和主动性实习,是开端也是结束。
展此刻自己面前的是一片任自己驰骋的沃土,也分明感受到了沉甸甸的职责。
在今后的工作和生活中,我将继续学习,深入实践,不断提升自我,努力创造业绩,继续创造更多的价值。
我认为大学生实习难,就业难,除非你有关系,能给你简单找到工作,否则就难逃市场选取的厄运。
我在该公司实习总结了五个攻略,只能智勇双全,才能在这个社会中出人头地。
1、宜主动出击:找实习岗位和找工作一样,要讲究方法。
公司一般不会对外公布实习机会,能够主动和其人力资源部门联系,主动争取实习机会。
可个性留意正在招聘人选的公司,说明其正缺乏人手,在没有招到适宜的员工的状况下,很有可能会暂时选取实习生替代。
2、宜知己知彼:求职信和求职电话要稳、准、狠,即稳当地了解公司所处的行业大背景及所申请岗位的要求,准确地阐述自己的竞争力,自信自己就是对方要找的人;同时很诚恳地表现出低姿态,表示实习的热望和决心。
web前端实习报告三篇

web前端实习报告三篇ﻫ篇一一、实训项目ﻫ简易记事本二、实训目得与要求ﻫ本次实训就是对前面学过得所有面向对象得编程思想以及JAVAWEB编程方法得一个总结、回顾与实践,因此,开始设计前学生一定要先回顾以前所学得内容,明确本次作业设计所要用到得技术点并到网上搜索以及查阅相关得书籍来搜集资料.通过编写采用JSP+Servlet+JavaBean技术框架得应用系统综合实例,以掌握JavaWEB开发技术。
具体要求有以下几点:1、问题得描述与程序将要实现得具体功能。
ﻫ 2、程序功能实现得具体设计思路或框架,并检查流程设计.3、代码实现.4、设计小结。
三、实训项目得开发环境与所使用得技术ﻫ基于J2SE基础,利用以上版本得集成开发环境完成实训项目,界面友好,代码得可维护性好,有必要得注释与相应得文档。
四、实训地点、日程、分组情况:ﻫ实训地点:4栋303机房日程:阶段:1、班级分组,选定课题,查阅相关资料半天2、划分模块、小组成员分工半天3、利用CASE工具进行系统设计与分析,并编制源程序5天第二阶段:上机调试,修改、调试、完善系统2天第三阶段:撰写、上交课程设计报告,上交课程设计作品源程序(每人1份)2天五、程序分析功能模块说明弹出菜单for(intf=0;f创建保存文件对话框ﻫ publicvoidsaveFile {ﻫ创建打开文件对话框ﻫprivatevoidopenFile{J;intresult=(null);if(result==_OPTION)}ﻫ{try{ﻫ ;((int) ;char[]context=newchar[len];(context,0,len); ;ﻫ (newString(context));ﻫJ ;intresult=(null);if(result ==_OPTION)}ﻫ{try{;(file);(); ;ﻫ}catch(Exceptione){("保存文件失败!");}}elsereturn;}catch(Exceptione){(”打开文件失败!");}}elsereturn;ﻫ六、程序设计及实现ﻫ1、实现弹出菜单(JpopupMenu)2、设置字型,字体大小,字体颜色3、实现自动换行七、实训总结通过3天得实训,虽然实训得时间不长,但就是总体上收获就是很大得,我们得java课程学到得只就是java与皮毛,[javaweb实习报告]一开始我还没有信心完成。
web前端开发实训总结(优秀9篇)

web前端开发实训总结(优秀9篇)web实训总结篇一大三下学期开始自学的前端,断断续续半年多,开始找前端相关的工作;到现在,走过了毕业期的十字路口,已经工作一年了;好吧,严重掉底子了,我是个比较懒的人。
既然起步较晚,那么就只有马不停蹄的追赶了,奔跑吧,小前端!写这个20某X的年终总结,没什么经验之谈,只是继往开来,反省反省;继续追逐大神们的脚步,偶尔站在巨人的肩膀上眺望下未来!一、原谅我,Jquery:工作之前,那时什么基础都没有,只是逼于即将毕业后的压力,百度到了前端开发,就直接从原生JS开始学了;学不动了,问了下认识的计算机系的学长,知道了Jquery,OK,学吧。
然而我并没有太大兴趣。
因为我买了本‘高三’,jquery只是对‘高三’进行了整体的封装,他把我要做的事都做了,那好吧,继续原生JS喽;不得不说那时做的最多的就是原生JS仿写各种特效;还想了个主题,弄了一堆静态页面,拼了个网站的样子作为找工作的‘作品’,后来,我知道我错了,写那些只是属于前端基础的一小部分,工作毕竟是工作,Demo终难上台面,团队的配合以及开发的效率才是最重要的;现在工作以jquery为主,至于曾经写的各种效果,现在也都有对应的现成组件,拿来用就是;之前无知时忽视了的jquery,工作后开始马不停蹄的各种资源补缺了,还好原生JS没有丢,作为前端的根基,在jquery以外帮了我不少;现在,基础组件一般都是以jquery插件的形式做的,但是业余有时间我都会用原生JS实现一些,因为我不想因为jquery而逐渐忽视原生JS。
二、必须追求的模块化:前端的模块化是非常必要的,之前对模块化一直是停留在概念阶段,没有太多实践,只是感觉特别好,毕竟在追逐大神们的脚步嘛!忍不住选择了玉老师的Seajs,试着把原来写的jquery和几个组件,划分成模块,用Seajs组织到一起;由于工作中的前端结构已趋于稳定,一下子不可能整体改,所以我只是在本地新建了个目录,一有时间就考虑下,怎么以模块化的搞法从新组织下;私下里,为了证实我在工作的本地前端结构可用,还专门弄了个简单的博客,按照自己对模块化的想法,首先以自己的博客作为实验场,来验证可行性;不管结果怎么样,不管这样做好不好,就当是一种锻炼吧;愚论拙见,只当逗大神们一笑吧!三、弱小者的强大力量,CSS:HTML、CSS作为前端开发最基础的一部分,可能在后端眼中不值一提吧,确实我也这么认为;但是,我更认为,前提是你能够把这些基础乱熟于心,并且对各种浏览器的兼容性了然于胸,闭着眼睛也能写出简洁明了的HTML、CSS;好吧,其实这只是我对自己的一个长期的要求;因为模块化,不只是JS,对应的少不了HTML、CSS;为了与JS的模块化遥相呼应,那么CSS的模块化是不可忽略的,只是就CSS来说,要想做到极致精简、模块化、可复用,不是想想就可以的;是的,你必须还是得要把一些逻辑性的东西引入CSS才行;恩,SASS是首选的CSS预编译器之一;风行于前后端的Bootstrap之前是基于Less的,后来全部开始转向Sass了;所以,无论现在对于Bootstrap熟练度有多少,我想其对于前端样式的构建思想是非常值得学习的;以Sass作为前端样式的构建工具,来实现精简、模块化、可复用的样式,我想那不是梦,当然,一切都是需要历练和积累的;四、革命性的转折点:Nodejs不好意思,Nodejs学的还不多,若有夸大其词的地方,大神还是忽视我吧;花满楼的博客只是对Nodejs小小的探索,诸多不足,有待改进,望大神路过指导;五、话说,我想多了:每次信誓旦旦做的规划,都会随着时间的脚步渐渐风化;每次回顾过去,只留一声叹:时间都去哪了?呵呵,还是走好脚下的路吧,毕竟做该做的事总归是好的;愿和我一样的小前端们,梦想都不是白日梦!六、遇见最好的你:Angularjs目前工作的情况并没有太大的变动,有些事还是得以团队工作为重;只是业余会多些躁动,20某X年,想学好Angularjs;一方面作为工作内的技术储备,另一方面,我的实验场还是需要多些内含的,打算首先用Angularjs改造博客的后端程序;权当锻炼吧!风靡前端的框架还有很多,大神们也是有各种论调,我想选Angularjs因为我胃口小,一口吃不下一个包子,还是细嚼慢咽的好;主要是:Angularjs的思想很吸引我,依赖注入、指令系统等;对我来说既陌生又无限的吊胃口;无论学的怎么样,我想理解这些思想对现在的我来说恐怕才是最重要的。
web实训总结(通用3篇)

web实训总结(通用3篇)【篇一】web实训总结1)、首先确定网站的目标是关键,明确谁是网站将来的访问者。
确保目标和主题明确、数据充分并保持目标的简洁性。
其次是确定网站的主题风格和创意点。
主题选材要小而精,最好是选择自己擅长或感兴趣的内容。
选题不要太滥,目标定位不要太高。
最后是网站结构的确定,规划一个网站结构,可以用树状结构先把每个页面的内容大纲列出来,尤其是要制作一个有很多页面的大网站时,特别需要把这个架构规划好,同时要考虑到以后可能的扩充性,免得做好以后又要经常该整个网站的架构,费时又费力。
规划好结构后,进行网站目录设置。
根据网站的主题和内容来分类规划目录,不同的栏目要对应不同的目录,在各个栏目下也要根据网站的内容的不同将其分化成不同的子目录。
2)、要设计一个网站,制作环境是不可少的例如:配置良好的计算机及相关设备;配置完善的系统环境,出了安装操作系统外,还要注意升级浏览器的版本,如果要进行服务器端程序开发还要有相应得软件系统;备齐网页开发工具软件,包括网页制作工具、服务器端程序开发工具及一些实用的辅助工具;备齐素材制作和加工软件,包括对图形、动画、流媒体和声音进行处理的素材制作和加工软件;备齐常用的网站发布工具等。
3)、设计好的网页要有创意要新颖而其还要有自己的特色,要有充实的内容和浏览价值,网页的布局有一定的艺术性。
网页的设计与网页内容的配合最为关键,确定网页的主题和定位方向以后,就以目标去搜集相应的材料充实和丰富主题。
在设计网页时,千万不要让信息和图片填满网页,网页看起来必须是干净的、有组织有条理的,使用很容易阅读的字体。
4)、文字与图片是任何一个网站最基本的要素,假如说网页上只有静止的文字与图片,也就未免显得过于沉闷这样就需要一些动画等交互性的是网页处于动静结合中。
设计一些复杂的大型的用途更多的网页时就要使用到网页程序或网页脚步。
动态网页是网页获得用户的指令,然后网页拿着指令到数据库中找和指令对应的数据,然后传递给服务器,通过服务器的编译把动态页面编译成标准的HTML代码,传递给用户浏览器。
web实训报告

web实训报告在本次的Web实训过程中,我主要学习了网站开发的基本知识和技能,并运用所学知识完成了一个具体的项目。
以下是我在实训中的学习和实践经历的总结。
一、实训内容介绍我们的实训项目是开发一个在线购物网站,主要功能包括用户注册、登录、商品展示、购物车管理、订单处理等。
实训期间,我主要完成了以下几个阶段的工作:1. 需求分析与设计在项目开始之前,我们进行了详细的需求分析和系统设计。
通过与需求方沟通,我们明确了网站的功能需求和交互设计,制定了项目计划和工作流程。
2. 系统搭建与数据库设计基于需求分析的结果,我们进行了系统的搭建和数据库的设计。
我使用了前端开发技术HTML、CSS和JavaScript,后端开发技术PHP,并使用MySQL数据库存储数据。
通过这些工具和技术,我们建立了一个能够实现网站基本功能的框架。
3. 前端页面开发在系统搭建完成之后,我负责前端页面的开发工作。
根据界面设计原则和用户体验要求,我使用HTML和CSS编写了网站的各个页面,并运用JavaScript实现了动态效果和交互功能。
在开发过程中,我注重页面的整洁美观,保证了用户的良好浏览体验。
4. 后端逻辑开发除了前端页面开发之外,我还参与了网站后端逻辑的开发工作。
通过PHP编写后端代码,我实现了用户注册登录、商品信息的增删改查、购物车管理和订单处理等功能。
在逻辑开发中,我注重代码的可读性和可维护性,保证了系统的稳定性和功能完善性。
5. 测试与调优在开发完成后,我们进行了系统的测试和调优工作。
通过对各个功能模块的测试,我们发现并修复了一些问题,确保了系统的正常运行。
同时,我们也进行了性能优化,提高了系统的响应速度和用户体验。
二、实训心得与收获通过本次Web实训,我获得了很多宝贵的经验和收获。
以下是我在实训中得到的几点心得:1. 学以致用在实训过程中,我将所学知识应用到实际项目中,通过实践中的发现和解决问题,加深了对知识的理解和掌握。
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
WEB
开
发
实
训
报
告
系别:XXXXXXXXX 姓名:XXX
班级:XXXXXXXX
学号:XXXXXXXXXXX
WEB开发基础实训:网上书店
一、实训时间:2012年4月9日——2012年4月13日
二、实训地点:2209
三、实训目的:
1、掌握静态网页布局
2、掌握HTML语言的编写
3、熟悉CSS+DIV、JavaScript等网页编辑技术
4、掌握网站子页面制作
四、实训内容:
(一)、首页制作
1、顶部与导航设置
(1)、先建立站点
(2)、创建“网上书店”文件夹,在文件加中创建“images”、“css”等文件夹,根据需要,处理相关的图片并保存到“images”文件夹中。
(3)、打开Dreamweaver软件创建新网页,并将其保存到“网上书店”文件夹中,命名为“index.htm”,然后设置“页面属性”中“网页标题”为“网上书店”,背景色为白色,上、下、左、右边距为0像素。
(4)、在网页中插入表格,具体参数为3行1列,宽为900像素,填充、间距、边框都为0像素。
(5)、将“q.gif”、作为背景图片插入到表格的第1行单元格,并将第一行单元格高度设置为181像素。
(6)、在第一行单元格中嵌套表格,输入导航栏文字。
最终效果如图所示。
2、中部左侧页面设置
(1)、将第二行单元格拆分成两列,高度设置为600像素,左侧宽度设置为520像素,右侧宽度380像素。
(2)、在左侧单元格中插入新表格,在底部插入小的图片和文字。
填充两个宽为400像素,高为150像素的居中表格,并在表格中插入宽为100像素、高为150像素的图片,在图片右端插入一个 AP
DIVDIV,在DIV里输入文字,可随意移动,好调整。
(3)、在左端底部插入小的图片和文字。
然后填充一个三行两列的宽为400像素,高为150像素的居中表格。
在表格中输入文字,插入对应图片。
为了在图片上插入一个图片。
采用在图片上插DIV 的方法,插入三个AP DIVDIV在DIV内插入图片new_icon.gif。
(4)、最终效果如图所示
3、中部右侧页面设置
(1)、在右侧单元格中,插入填充图片bullet3.gif并输入文字,接着插入一个宽为330像素,高为150像素的居中表格,在左端插入AP DIVDIV,输入文字好移动,并在表格向右对齐插入宽为120像素、高为80像素图片about.gif,
(2)、接着插入图片border.gif,然后插入小的图片和文字。
填充一个六行一列的宽为200像素,高为400像素的向左对齐表格。
在表格中输入文字,插入对应图片。
为了在图片上插入一个图片。
采用在图片上插DIV的方法,插入三个AP DIVDIV在DIV内插入图片promo_icon.gif。
(3)、在右端插入一个填充一个二十二行一列的宽为150像素,高为400像素的向右对齐表格。
在表格中输入文字,
(4)、最终效果如图所示
4、底部页面设置
(1)、插入一个三行一列的表格
(2)、在第一行中输入如“首页、联系我们……”的字段,作为尾部术语
(3)、在第二行插入一个书店商标图片,在第三行插入一点小颜色棍型图片调和
(4)、最终效果如图所示
(二)、“书籍”页面的制作
1、创建新网页,并将其保存到“网上书店”文件夹中,命名为“书籍.htm”.
2、在网页中插入表格,具体参数为3行1列,宽为900像素,填充、间距、边框都为0像素。
将“q.gif”、作为背景图片插入到表格的第1行单元格,并将第一行单元格高度设置为200像素。
然后插入一个AP DIVDIV,在DIV内插入一个名为” 4.swf”的Flash动画。
3、将第二行单元格拆分成两列,左侧宽度设置为150像素,右侧宽度750像素。
在左侧单元格中输入相应文字。
为了制作专题书栏,插入图片zt.jpg,并在图片上插入五个宽为150像素,高为70像素的AP DIV,相应插入宽为150像素、高为70像素的图片。
在左端底部插入小的图片和文字。
然后填充一个三行两列的宽为400像素,高为150像素的居中表格。
在表格中输入文字,插入对应图片。
为了在图片上插入一个图片。
采用在图片上插DIV的方法,插入三个AP DIV在DIV内插入图片new_icon.gif。
4、在中部右端,顶端插入一个宽为750像素,高为200像素的图片b1.jpg,想要在其上放置一个动画,于是在图片上插入一个宽为647像素,高为178像素的AP DIV,在DIV内插入Flash动画js.Swf。
随后插入图片1f.jpg,接着插入一个宽为700像素,高为150像素的居中表格。
下同。
5、制作垂直浮动广告,在页面右端插入一个宽为160像素,高为90像素的AP DIV,在DIV内插入图片fffff.jpg,并将脚本语言jj.js插入DIV代码区中中。
6、最终效果如图所示
(三)、“书籍价格”页面的制作
1、创建新网页,并将其保存到“网上书店”文件夹中,命名为“书籍价格.htm”。
2、在网页中插入表格,具体参数为3行1列,宽为900像素,填充、间距、边框都为0像素。
将“q.gif”、作为背景图片插入到表格的第1行单元格,并将第一行单元格高度设置为200像素。
3、将第二行单元格拆分成两列,左侧宽度设置为150像素,右侧宽度750像素。
在左侧单元格中输入相应文字。
为了制作折扣栏,插入图片ddd.jpg,并在图片上插入三个宽为150像素,高为70像素的AP DIV,相应插入宽为150像素、高为70像素的图片。
4、制作鼠标经过图片,将鼠标定位在要插入图片的位置,选择菜单栏上的插入——图片对象,点击鼠标经过图片,在标题栏里插入图片hsd.jpg和zb.jpg。
5、在中部右端,顶端插入一个宽为750像素,高为245像素的图片b11.jpg,想要在其上放置一个动画,于是在图片上插入一个宽为587像素,高为203像素的AP DIV,在DIV内插入Flash动画556.Swf。
随后插入图片01f.jpg,接着插入一个宽为700像素,
高为150像素的三行四列的居中表格,相应输入文字和插入图片。
下同。
6、制作时间轴,在页面左端插入一个宽为100像素,高为100像素的AP DIV,在DIV内插入图片lian.jpg,选中窗口中的时间轴,将DIV标签拖入时间轴内,然后右击DIV标签选择记录路径,之后可自由拖动。
7、最终效果如图所示
(四)、“用户注册”页面的制作
1、创建新网页,并将其保存到“网上书店”文件夹中,命名为“用户注册.htm”。
2、在网页中插入宽为900像素、高为700像素的AP DIV,填充、间距、边框都为0像素。
将“q.gif”、作为背景图片插入到 AP DIV。
3、之后,回车插入图片yhzc.jpg。
在图片下端插入一个AP DIV,在AP DIV中插入8行1列的表格,用来设置表单,使用到表单中的文本域、复选框、按钮、和列表框。
4、制作飘动文字效果,插入AP DIV,在AP DIV 中输入文字,选中AP DIV,随后打开代码区,在内输入代码<marquee behavior="scroll" direction="up" scrollamount="8">。
5、最终效果如图所示
五、实训总结:
一周的实训转瞬即逝,在这短暂的时间里,我们在老师的指导和帮助下,对于网页设计与制作有了进一步的了解。
通过这次实训,我学到了很多有价值的东西。
我独立的完成网站设计的全过程,把设计中散乱的网页链接成框架体系,使平时学到的知识点有了很高的提高,并且合理的在试验中进行了实践。
在这次实验的过程中,我搜集了大量的素材和网页设计的技术技巧方面的书,增加知识面,给我在以后的设计过程中能博采众长,制作出好的网页打下了基础。
最后,我感受最深的是:想要最好一个网站,素材和技能都十分重要。
好的素材需要多放面查找资料的,可以从图书、网站和新闻上查找的。
好的技能需要不断的实践,经常锻炼做网页。
如果拥有好的素材和精湛的技能就可以做出最精湛的网页。