《Web应用基础》课程结业报告

《Web应用基础》课程结业报告

1.做的什么

我选择的是做5个静态网站，其中包括一个较复杂的以bootstrap为框架的网站和四个简单的css样式的网站。
boostrap网站是我模仿一个企业网站做的响应式公司网站，运用mdb的框架完成了整个页面的设计，然后在主体内容中加入了许多的超链接和图片来填充。
剩下四个我都是用css3样式做的，比较简单但很有趣。包括3D调查问卷、创意登陆表单、彩色计算器、任务列表管理表单。

2.开发过程

通过棋歌网的学习以及老师的讲解，我学习了建立网站和制作网页的知识，对网页制作的基础知识也有了一定的掌握。但本次实验历时很久，对我仍是个不小的挑战，我面向棋歌教学网和百度编程，最终完成了本次实验。实验环境我用的VSCode。我先做的bootstrap网站，为了完成这个网站我查看了许多企业网站，最终选定了一个国外的企业网站来模仿，而且之前也做个MDB框架的网页，完成起来虽说麻烦但有方向。其余4个网站我是在网上学习了相关的教程和例子后做出来的，虽说我从没接触过这方面的内容，但css3样式的网页很有趣，便边摸索边做了出来。

3.遇到的问题

在开发程序的过程中我遇到许多问题。如何实现把鼠标放在图片上可以弹出文字提示，如何使页面内容逐步显现，如何在图片下加一个按钮使对图片的详细介绍可以随按钮显现或隐藏，如何在鼠标移到图片上时使图片变颜色。

4.如何解决

使用div+css实现鼠标悬停图片上方时显示文字内容原理：首先设置一个盒子对象，并且将图片使用style标签内设置为CSS背景图片，同时设置该对象html a超链接display:none隐藏，该超链接锚文本内放好文字内容，最后设置鼠标悬停经过整个对象时候显示超链接内容。使页面内容逐步显现可以使用分块编码技术。
这些问题我都是在网上查找的资料和讲解，再在反复的试验中解决我所遇到的问题。

5.哪些未解决

本次实验中我将网站上传到github后，展现出来的网站与我做的网站不符，背景图会变得很大，一直解决不了，导致我的网页排版看起来很乱很糟糕。

6.总结

本学期的WEB应用基础课程让我第一次接触到了未上大学时对计算机专业幻想的学习内容，让我实操了如何制作网页、如何设计网页，课程内容很有趣，老师也为我们提供了一个良好的学习网站。通过这门课程的学习和网上资料的查找，我基本了解了JS、TS、CSS、HTML，并且会开发简单的bootstrap网页，自学能力得到了很大的提升。这个课程对我来说是有很多意义和帮助的一门课。