Web结业报告

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

一、结业任务

本课程结业需完成以下两个任务，提交可浏览的网址（URL）。

（占总成绩40%）任务一：构建一个静态或动态网站。以下要求中任选A或B，要求如下：

    A. 静态网站

         采用纯 CSS 或你喜欢的任何 CSS 框架如 Bootstrap、MDB、TailwindCSS 等构建一个主题（游戏、电影、书籍、宠物等）自选且不少于5个页面（可页间跳转）或5个内容模块（可在一个长页面中）的网站。

    B. 动态网站

       使用任何一个前端框架如 Angular、Vue 等进行某应用（如英雄之旅、待办事项、图书管理等）的开发，需要有 CRUD 即增删改查功能并有一定的样式。

无论你选择静态还是动态网站，该网站都需部署到你喜欢的网站托管服务器上如 Gitpage 等（Angular项目可参阅 https://angular.cn/guide/deployment）。

该网站需放置（超链接）你的结业报告（即本篇）

我选择的A，做了一个我在B站的个人界面

二、开发过程

1.开发工具

Visual Studio Code

使用的插件

 

 

2.遇到的问题

1.浏览器兼容性问题，在开发过程中，我发现某些特定浏览器对某些CSS属性的支持不完整或存在bug，以及bgm和视频无法正常播放。解决方法：查看人检测浏览器版本，并根据需要提供特定的CSS样式或JavaScript兼容性代码，无法从代码上优化。

2.展示图片的时候，因为每张图片的大小不一致，导致在网站上面，文案和图片都没有对齐，很难看。解决办法：统一剪切，使得大小尺寸一致

3.视频展示：B站个人主页需要展示用户上传的视频。问题是如何在页面中动态加载并展示视频的缩略图、标题和时长等信息。该问题并未解决，因为没学会，只能用图片代替了。但是点击图片一样能够跳转到视频页面

4.github的托管问题。github有时候一直上不去，导致没法托管网页。解决办法：参考了很多资料，最后在同学的帮助下成功的托管上去了

---

总结

总结起来，编写网页的过程中，我面临了页面布局、视频展示、效果以及响应等多个具体问题。解决这些问题需要灵活运用HTML、CSS等知识，并结合相关的布局技术和API调用来实现功能需求。通过面对这些问题并找到解决方法，我不仅提升了自己的技术能力，还深入了解了网页的设计与开发，但同时也看见了自己的不足，因为自己不认真听课导致自己在编写网页的过程中处处受挫，几乎一直在搜索资料，浪费了大量的时间。这次经历不仅是对前端开发技术的实践，也是对学习方法和问题解决能力的锻炼。我相信这些经验和技能将对我今后的Web开发之路产生积极的影响