Web 技术 - HTML+CSS 实验与 JavaScript 实验

目录

• 写在前面
• 实验一
• 实验二
• 写在最后

写在前面

本来想在这劝退不喜欢写代码的别选这课，突然想起来能搜到这篇文章的一定都选了吧哈哈。

实验一

作业要求：

• 以PSD文件作为原始素材（已上传到群里，三选一），通过切片、HTML+CSS的形式将网站首页进行实现。
• 要求点1：结合DIV和多种CSS布局（2种以上）
• 熟悉CSS盒模型，能够使用margin、padding
• 熟悉img、表单元素等HTML标签
• 熟悉CSS各类样式，尤其是字体、背景等。
• 考察方式：如选择检查作业（高分），会对网页局部设计进行提问，需要陈述其中设计思路。

github 项目地址：https://github.com/Luckyblock233/nimalaxiangguo。

实验二

Web Technology Javascript Lab.

Main reference: https://www.geeksforgeeks.org/navigating-the-labyrinth-a-maze-generator-game-using-html-css-javascript/

实验要求：

本次实验针对JavaScript教学内容，可在以下几个实验内容中选择其中之一，如下：

1. 百度地图在线应用

本项目旨在使用原生JavaScript开发一个简单的百度地图应用。该应用将展示基本的地图功能，包括地图的加载、标记的添加、地图缩放和拖动等功能。除引用百度地图API外，项目原则上不依赖其他第三方库。具体要求如下：

• 地图加载:申请百度个人秘钥，使用百度地图API加载地图，地图初始视图设置为中南大学新校区信息楼。
• 用户可以通过鼠标滚轮或地图上的缩放控件进行地图的缩放操作。
• 地图拖动, 用户可以通过鼠标拖动地图，查看不同区域。
• 添加标记, 用户可以在地图上点击某个位置，添加一个标记（Marker）。每个标记需显示该位置的经纬度信息。

1. 迷宫游戏

原生JavaScript开发一个走迷宫游戏。玩家将控制一个角色在迷宫中移动，目标是找到出口。游戏将实现基本的迷宫生成、角色移动、碰撞检测等功能。项目将不依赖于任何第三方库，确保使用原生JavaScript进行开发。

• 游戏界面, 游戏界面应为一个矩形画布（Canvas），尺寸自己设定。
• 游戏开始时随机生成一个迷宫，确保迷宫有唯一的出口。迷宫应由墙壁和通道组成，墙壁应不可穿越。
• 玩家控制的角色应能通过键盘的上下左右箭头键进行移动。角色的移动应遵循迷宫的通道，碰到墙壁时无法移动。
• 游戏应有计时系统，记录玩家从开始到找到出口所用的时间。在游戏结束时，显示用时信息。
• 设定一键智能寻路按钮，当用户点击后，可以提示正确走出迷宫的路径。

作业需要提交代码和一个word文档，文档内需要简述设计要点（不超过3页），系统内作业提交截止时间为12月15日，通过中南大学信息门户—教学可视化-课堂作业提交，Word文档命名方式“学号-姓名.docx”。实验检查时间暂定为12月2日。

github 项目地址：https://github.com/Luckyblock233/AL_1S-s-Adventures-in-WonderMaze

写在最后

然后是夹带私货环节：

不对怎么在这号上夹带私货开了哈哈。