web前端课程设计:猫咪领养网站 HTML+CSS+JavaScript

作品介绍:菜鸡学生的简单课程设计作业,HTML写结构,CSS实现每个页面的样式。JS实现图片轮播,点击回到顶部,鼠标点击事件。

一、作品演示

1.登录页面

猫咪领养网站登录页面

2.首页

1.首页顶部为轮播图;
2.点击卡通猫头可转跳到对应的信息页面;
首页1

3.点击对应图片的小猫可转跳到领养该猫咪的对应信息页面;
首页2

4.大猫图为轮播图;
5.点击小猫图下文字转跳到申请领养页面;
首页三

6.该图为首页底部;点击右下角卡通黑猫图返回顶部;
首页四

首页图总览
首页总览

3.领养猫咪

1.点击猫咪信息栏可转跳到完整猫咪信息页面;
2.点击 领养·寻猫模块 可申请发布寻猫等信息;
领养猫咪页面

4.寻找猫咪

寻找猫咪页面

5.联系我们

在这里插入图片描述

6.关于我们

在这里插入图片描述

二、代码实现

1.HTML结构代码

1.登录页面代码
登录页面

2.首页部分代码
在这里插入图片描述
在这里插入图片描述

3.领养猫咪页面部分代码
在这里插入图片描述

4.寻找猫咪页面部分结构代码
在这里插入图片描述
5.关于我们页面部分代码截图
在这里插入图片描述

2.CSS样式代码

部分代码截图
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

3.Javascript

部分代码截图
在这里插入图片描述

在这里插入图片描述

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐