失眠网 > Web大学生网页作业成品——个人班级网站设计与实现(HTML+CSS)

Web大学生网页作业成品——个人班级网站设计与实现(HTML+CSS)

时间：2022-02-22 19:30:50

🌩️ 精彩专栏推荐👇🏻👇🏻👇🏻
💂 作者主页: 【进入主页—🚀获取更多源码】
🎓 web前端期末大作业：【📚HTML5网页期末作业 (1000套) 】
🧡 程序员有趣的告白方式：【💌HTML七夕情人节表白网页制作 (110套) 】

📂文章目录

二、📚网站介绍三、🔗网站效果▶️1.视频演示🧩 2.图片演示四、💒 网站代码🧱HTML结构代码五、🎁更多源码

二、📚网站介绍

📔网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。

📓网站程序方面：计划采用最新的网页编程语言HTML5+CSS3+JS程序语言完成网站的功能设计。并确保网站代码兼容目前市面上所有的主流浏览器，已达到打开后就能即时看到网站的效果。

📘网站素材方面：计划收集各大平台好看的图片素材，并精挑细选适合网页风格的图片，然后使用PS做出适合网页尺寸的图片。

📒网站文件方面：网站系统文件种类包含：html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件；

📙网页编辑方面：网页作品代码简单，可使用任意HTML编辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++等任意html编辑软件进行运行及修改编辑等操作）。

其中：

（1）📜html文件包含：其中index.html是首页、其他html为二级页面；

（2）📑 css文件包含：css全部页面样式,文字滚动, 图片放大等；

（3）📄 js文件包含：js实现动态轮播特效, 表单提交, 点击事件等等（个别网页中运用到js代码）。

三、🔗网站效果

▶️1.视频演示

I57JP- 我们的班级(7页)HTML+CSS+JS

🧩 2.图片演示

四、💒 网站代码

🧱HTML结构代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="/1999/xhtml" xml:lang="en" lang="en"><head><title>我的班级</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="description" content="Place your description here" /> <meta name="keywords" content="put, your, keyword, here" /> <meta name="author" content=" - website templates provider" /> <link href="style.css" rel="stylesheet" type="text/css" /></head><body id="page1"><div id="header"><div class="container"><div class="wrapper"><div class="logo"><h1><a href="home.html">我的班级</a><span>明之尚美，馨德亦缘</span></h1></div></div><ul class="nav"><li><a href="index-2.html" class="first current">首页</a></li><li><a href="about.html">关于我们</a></li><li><a href="photo.html">相册</a></li><li><a href="lianxi.html">留言板</a></li><li><a href="houyu.html">后语</a></li></ul></div></div><div id="content"><div class="inner_copy"><div class="inner_copy"> Need a website? <a href="/">Free website templates</a> by professional designers at WTO.</div></div><div class="container"><div class="inside"><div class="box alt"><div class="left-top-corner"><div class="right-top-corner"><div class="border-top"></div></div></div><div class="border-left"><div class="border-right"><div class="inner"><div class="wrapper"><h2><strong><br />有缘我们相聚<br /></strong></h2><p style="line-height:24px;"><br />9月，一群朝气蓬勃怀揣梦想与喜悦，来自五湖四海的青年来到了北海职业学院，组建了我们软件1班这个大家庭。从此快乐充实的生活开始了！</p><p> 这是一个团结奋进、朝气蓬勃、温暖和谐的集体。在辅导员及各位班干的带领下，团结勤奋。刻苦努力，取得了很大的成绩。截至目前，全班35位同学中，共青团员29人、党员2人、预备党员6人、入党积极分子9人。班级同学学习勤奋刻苦，在大家的共同努力下，也获得了不少的成绩。<br /></p><p> 学习之余，班级也强抓宿舍卫生建设。在学校、院系的带领下，在每个同学的努力下，班级宿舍卫生在院系乃至学校的卫生评比中也名列前茅。课余生活丰富多彩也是我们班级的一大特色。大家积极参与学校院系组织的各项活动，在校庆晚会、运动会、院系篮球赛当中，都能看到我们班级同学活跃的身影。<br /></p><p> 我们一步步走来，我们成长成了一个互帮互助奋、发向上的集体；一个博学务实、拼搏不殆的集体；一个自强自信的集体。这三年里，我们有欢笑，也有泪水；有成功，也有失败；有无悔，也有些许无奈。一年半的历练，我们多了一份淡定与从容，少了一份稚嫩与青涩：多了一份关爱，少了一份自私；多了一份坚强，少了一份懦弱。虽然我们的大学生涯还有许多未知的路要走，还有太多的不能承受需要我们去承受，但我们全体支部成员会以如既往的走下去，建设好我们的班级，承担我们的责任，追逐我们的梦想，寻找属于我们的天空！<br /></p><p> “信心无畏，青春无悔”是我们的写照！</p><p> 我坚信，我们的未来一定会更美好！</p><p style="line-height:24px;"><br />今天是：<script src="Scripts/clock.js" language="javascript"></script></p></div></div></div></div><div class="left-bot-corner"><div class="right-bot-corner"><div class="border-bot"></div></div></div></div></div></div></div><div id="footer"><div class="container"></div></div></body></html>