临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页要求的总数量太多?没有合适的模板?等等一系列问题。你想要解决的问题,在这篇博文中基本都能满足你的需求~
原始HTML+CSS+JS页面设计, web大学生网页设计作业源码,这是一个不错的网页制作,画面精明,非常适合初学者学习使用。
作品介绍1.网页作品简介方面 :黑色通用的IT程序员资讯交流个人博客网站模板。喜欢的可以下载,文章页支持手机PC响应式布局。主要有:首页 公园简介 新闻动态 图片墙 详细地址 图片展示 联系我们 学习资料 搞笑图片 等页面html下载。
2.网页作品编辑方面:此作品为学生个人主页网页设计题材,代码为简单学生水平 html+css 布局制作,作品下载后可使用任意HTML编辑软件(例如:DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm 所有编辑器均可使用)
3.网页作品布局方面:网页布局整体为LOGO、导航、主体内容布局。子页面多种布局,兴趣爱好内容使用图片列表布局,成绩页面插入了表格,联系我们使用图片对齐方式设置了左对齐。
4.网页作品技术方面:使用CSS制作了网页背景图、鼠标经过及选中导航变色效果、下划线等。 首页制作了留言表单,同时简单使用JavaScript制作了表单判断(提交时表单不能为空)
文章目录
- HTML期末大作业~基于HTML+CSS+JavaScript千岛湖旅游景点网站设计与实现 (5个页面)
- 作品介绍
- 一、作品演示
-
-
- 1. 首页
- 2. 公园简介
- 3. 新闻动态
- 4.图片墙
-
- 二、代码目录
- 三、代码实现
- 四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)
- 五、源码获取
- 六、更多HTML期末大作业作品文章
- 七、更多表白源码
- 八、150套Echarts大数据可视化
1. 首页
2. 公园简介
3. 新闻动态
4.图片墙
二、代码目录 三、代码实现
<!DOCTYPE html>
<html><head><title>首页</title><meta http-equiv="Content-Type"content="text/html; charset=utf-8"/> <link rel="stylesheet" type="text/css" href="css/initi.css" /><link rel="stylesheet" type="text/css" href="css/index.css" /><!-- 图片浏览插件css --><link rel="stylesheet" type="text/css" href="css/show.css" /></head><body><div class="main"><div class="header"><div class="help"><a href="">联系我们</a> | <a href="">站点帮助</a> | <a href="">问题反馈</a> </div></div><div class="topbar"><ul><li><a href="index.html">首页</a></li><li><a href="about.html">公园简介</a></li><li><a href="news.html">新闻动态</a></li><li><a class="clicked" href="show.html">图片墙</a></li><li><a href="map.html">详细地址</a></li><li><a>图片展示</a></li><li><a>联系我们</a></li><li><a>学习资料</a></li><li><a>搞笑图片</a></li></ul></div><!-- 好像只有添加iframe才能使头部独立成一个文件来处理,而且使用js给导航栏添加单击样式<iframe name="contain" width="100%" height="100%"></iframe>--><div class="content"><div class="bar"><img src="images/bar3.jpg" /></div><div class="int"><div class="scrollbox"><div class="pic-list"><ul class="wrap"><li class="picture"><a href="#"><img alt="97站长网" src="img/T1z_LkXfdpXXaGP9rV-164-164.jpg" width="164" height="164" /><em>97站长网</em></a></li><li class="picture"><a href="#"><img alt="请叫我羊驼先生" src="img/T1NTfkXmdoXXaGP9rV-164-164.jpg" width="164" height="164" /><em>请叫我羊驼先生</em></a></li><li class="picture"><a href="#"><img alt="又到一年粽叶香" src="img/T18UnkXn4mXXaGP9rV-164-164.jpg" width="164" height="164" /><em>又到一年粽叶香</em></a></li><li class="picture"><a href="#"><img alt="一毕业就结婚" src="img/T1sUrlXkXhXXaGP9rV-164-164.jpg" width="164" height="164" /><em>一毕业就结婚</em></a></li><li class="picture"><a href="#"><img alt="小资最爱mini窝" src="img/T1jCLgXaBuXXaGP9rV-164-164.jpg" width="164" height="164" /><em>小资最爱mini窝</em></a></li><li class="picture"><a href="#"><img alt="人尽可帽相!" src="img/T1VQjmXjBcXXaGP9rV-164-164.jpg" width="164" height="164" /><em>人尽可帽相!</em></a></li><li class="picture"><a href="#"><img alt="除了二还有爱" src="img/T1HhjmXmJjXXaGP9rV-164-164.jpg" width="164" height="164" /><em>除了二还有爱</em></a></li><li class="picture"><a href="#"><img alt="锋芝恋被曝复合" src="img/T1Sh_mXi0eXXaGP9rV-164-164.jpg" width="164" height="164" /><em>锋芝恋被曝复合</em></a></li><li class="picture"><a href="#"><img alt="夏天别穿背背佳" src="img/T1MdLmXfFfXXaGP9rV-164-164.jpg" width="164" height="164" /><em>夏天别穿背背佳</em></a></li><li class="picture"><a href="#"><img alt="如果真有海角天涯" src="img/T1siLmXkJgXXaGP9rV-164-164.jpg" width="164" height="164" /><em>如果真有海角天涯</em></a></li> </ul></div><div class="pic-list"><ul class="wrap"><li class="picture"><a href="#"><img alt="当时我就震惊了" src="img/T1BgYlXhFnXXaGP9rV-164-164.jpg" width="164" height="164" /><em>当时我就震惊了</em></a></li><li class="picture"><a href="#"><img alt="糖果色夏日美甲" src="img/T1XrDnXbVaXXaGP9rV-164-164.jpg" width="164" height="164" /><em>糖果色夏日美甲</em></a></li><li class="picture"><a href="#"><img alt="欧美夏日潮搭" src="img/T1sSPmXeJbXXaGP9rV-164-164.jpg" width="164" height="164" /><em>欧美夏日潮搭</em></a></li><li class="picture"><a href="#"><img alt="开心时记得笑" src="img/T1CN2lXcRnXXaGP9rV-164-164.jpg" width="164" height="164" /><em>开心时记得笑</em></a></li><li class="picture"><a href="#"><img alt="夏天最爱睡地毯" src="img/T1nffmXfBhXXaGP9rV-164-164.jpg" width="164" height="164" /><em>夏天最爱睡地毯</em></a></li><li class="picture"><a href="#"><img alt="007裸体冰激凌" src="img/T1t2jlXfVkXXaGP9rV-164-164.jpg" width="164" height="164" /><em>007裸体冰激凌</em></a></li><li class="picture"><a href="#"><img alt="世上最帅100张脸" src="img/T1UWHhXopuXXaGP9rV-164-164.jpg" width="164" height="164" /><em>世上最帅100张脸</em></a></li><li class="picture"><a href="#"><img alt="做没心没肺的一对" src="img/T1Dk2lXfXkXXaGP9rV-164-164.jpg" width="164" height="164" /><em>做没心没肺的一对</em></a></li><li class="picture"><a href="#"><img alt="我的宠物叫笑笑" src="img/T1UyrmXhxbXXaGP9rV-164-164.jpg" width="164" height="164" /><em>我的宠物叫笑笑</em></a></li><li class="picture"><a href="#"><img alt="烟雨江南几时休" src="img/T1DfzmXj4hXXaGP9rV-164-164.jpg" width="164" height="164" /><em>烟雨江南几时休</em></a></li> </ul></div><div class="pic-list"><ul class="wrap"><li class="picture"><a href="#"><img alt="有处仙境叫希腊" src="img/T1vWLlXlRqXXaGP9rV-164-164.jpg" width="164" height="164" /><em>有处仙境叫希腊</em></a></li><li class="picture"><a href="#"><img alt="甜蜜情侣街头装" src="img/T1nyYlXflnXXaGP9rV-164-164.jpg" width="164" height="164" /><em>甜蜜情侣街头装</em></a></li><li class="picture"><a href="#"><img alt="晃晃悠悠梦一场" src="img/T1UOrlXg0nXXaGP9rV-164-164.jpg" width="164" height="164" /><em>晃晃悠悠梦一场</em></a></li><li class="picture"><a href="#"><img alt="我是水果店捡来的" src="img/T1x4TmXcxfXXaGP9rV-164-164.jpg" width="164" height="164" /><em>我是水果店捡来的</em></a></li><li class="picture"><a href="#"><img alt="贾斯汀携子走红毯" src="img/T1VFPlXXVrXXaGP9rV-164-164.jpg" width="164" height="164" /><em>贾斯汀携子走红毯</em></a></li><li class="picture"><a href="#"><img alt="花朵草编休闲包" src="img/T1Z0zmXnFeXXaGP9rV-164-164.jpg" width="164" height="164" /><em>花朵草编休闲包</em></a></li><li class="picture"><a href="#"><img alt="你是我的眼!" src="img/T1upLmXadiXXaGP9rV-164-164.jpg" width="164" height="164" /><em>你是我的眼!</em></a></li><li class="picture"><a href="#"><img alt="百变发型DIY" src="img/T1j2HlXkRkXXaGP9rV-164-164.jpg" width="164" height="164" /><em>百变发型DIY</em></a></li><li class="picture"><a href="#"><img alt="褪了色的一个梦" src="img/T1SmYgXeRwXXaGP9rV-164-164.jpg" width="164" height="164" /><em>褪了色的一个梦</em></a></li><li class="picture"><a href="#"><img alt="俏丽流行爆美鞋" src="img/T120_mXgdfXXaGP9rV-164-164.jpg" width="164" height="164" /><em>俏丽流行爆美鞋</em></a></li> </ul></div></div> </div></div></div><div class="footer"><p class="address">地址:陕西省宝鸡市千阳县南寨镇闫家村五组27号</p><p>张旭超个人版权所有</p></div><p style="text-align: center">来源:<a href="http://www.mycodes.net/" target="_blank">源码之家</a></p></body>
</html>
四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)
web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)
适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站
五、源码获取
❉ ~ 关注我,点赞博文~ 每天带你涨知识!
❉1.看到这里了就 [点赞+好评+收藏] 三连 支持下吧,你的「点赞,好评,收藏」是我创作的动力。
❉ 2.关注我 ~ 每天带你学习 :各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板 、大学生毕业HTML模板 、期末大作业模板 、等! 「在这里有好多 前端 开发者,一起探讨 前端 Node 知识,互相学习」!
❉3.以上内容技术相关问题可以相互学习,可关注↓公Z号 获取更多源码 !