HTML静态网页成品作业(HTML+CSS)——我的班级介绍网页(2个页面)

🎉不定期分享源码,关注不丢失哦

文章目录

  • 一、作品介绍
  • 二、作品演示
  • 三、代码目录
  • 四、网站代码
    • HTML部分代码
  • 五、源码获取


一、作品介绍

🏷️本套采用HTML+CSS,未使用Javacsript代码,共有1个页面

二、作品演示

在这里插入图片描述
在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<div class="header"><div class="w"><div class="logo"><a href="index.html"><img src="./images/logo.png" class="logo_img"></a></div><ul class="nav"><li class="active"><a href="index.html">首页</a></li><li><a href="login.html">我要登录</a></li></ul></div></div><div class="banner"><div class="w"><img src="./images/banner.jpeg"></div></div><div class="main"><div class="w"><div class="main_title">班级简介</div><div class="main_jieshao"><div class="main_jieshao_text"><p>20级音乐学2班是一个团结友爱、积极向上的班集体,是一个由33名朝气蓬勃的同学组成的大家庭,其中女生22名,男生11名。我们的班级口号是“拧成一股绳,搏尽一份力,狠下一条心,铸我二班梦”。</p><p>我们怀揣着梦想与希望,充满着活力与激情,在弥漫着书香与人文气息的某某学院的天空中,汇聚在一起,在这里我们追寻自由,畅谈未来,团结一心,打造着属于我们的时代。怀抱活力与梦想,前方有彩虹,前方有鲜花。尽管路途遥远,尽管海浪汹涌,我们仍带着青春的活力与完美的梦想,杨帆起航。念我往昔,追之不可得。思我今朝,幸我所得。</p></div><div class="main_jieshao_img"><img src="./images/main_jieshao.jpeg"></div></div><div class="main_block"></div><div class="main_title">班级活动</div><div class="main_huodong"><div class="huodong_img"><img src="./images/hd1.jpeg"></div><div class="huodong_img"><img src="./images/hd2.jpeg"></div><div class="huodong_img"><img src="./images/hd3.jpg"></div><div class="huodong_img"><img src="./images/hd4.jpeg"></div><div class="huodong_img"><img src="./images/hd5.jpeg"></div><div class="huodong_img"><img src="./images/hd6.png"></div><div class="huodong_img"><img src="./images/hd7.jpeg"></div><div class="huodong_img"><img src="./images/hd8.jpeg"></div><div class="huodong_img"><img src="./images/hd9.jpeg"></div><div class="huodong_img"><img src="./images/hd10.jpeg"></div></div></div></div><div class="footer">	<div class="w">我的班级 版权所有</div></div>

五、源码获取

🥇 ~ 关注我,点赞博文~ 每天带你涨知识!
🎁1.看到这里了就[点赞+好评+收藏]三连 支持下吧,你的「点赞,好评,收藏」是我创作的动力。
💙2.想要获取本文源码,点击前往吧

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/20241.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

金属切削机床5G智能工厂工业物联数字孪生,推进制造业数字化转型

金属切削机床5G智能工厂工业物联数字孪生&#xff0c;推进制造业数字化转型。随着工业4.0时代的到来&#xff0c;制造业正面临着前所未有的变革与挑战。在这场变革中&#xff0c;金属切削机床智能工厂工业物联数字孪生平台正成为推动制造业数字化转型的重要力量。 数字孪生是指…

【vuejs】v-if和v-show的原理、异同、使用场景的分析

1. v-if 和 v-show 的共同点 1.1 作用效果的相似性 在Vue中&#xff0c;提供的v-if和v-show都是用来控制元素是否在页面上显示的条件指令。 当条件为true时&#xff0c;它们都会使元素可见&#xff1b; 当条件为false时&#xff0c;它们都会隐藏元素。 这一点在Vue的官方文…

香港云服务器好还是国内的好?

香港云服务器与国内云服务器各有其优点和缺点&#xff0c;选择哪种类型的云服务器主要取决于业务需求、用户群体、网络需求以及成本考虑。以下是对两者进行详细比较的内容。 首先&#xff0c;从网络速度和稳定性来看&#xff0c;香港云服务器具有独特的优势。由于香港是全球数据…

操作系统Linux的基本介绍

操作系统Linux的基本介绍如下&#xff1a; 一、概述 Linux是一个自由和开放源代码的类Unix操作系统&#xff0c;它基于POSIX和Unix的多用户、多任务、多线程和多CPU的操作系统。Linux最初是作为自由软件&#xff0c;由林纳斯托瓦兹&#xff08;Linus Torvalds&#xff09;在1…

XSS攻击揭秘:从Cookie窃取到防御策略

实战中的窃取用户Cookie信息并保存到远程服务器的过程&#xff0c;通常涉及以下几个关键步骤&#xff1a; 实战步骤详解 1. 寻找XSS漏洞 首先&#xff0c;攻击者需要找到一个存在XSS漏洞的网站。这通常是通过代码审计、使用自动化工具扫描或手动测试来完成的。 2. 创建恶意…

企业文件加密:保障知识产权与客户隐私

在数字化时代&#xff0c;企业文件的安全成为了保护知识产权和客户隐私的关键。随着网络攻击和数据泄露事件的日益增多&#xff0c;企业必须采取强有力的措施来确保其敏感信息的安全。文件加密技术作为一项重要的数据保护手段&#xff0c;对于维护企业的竞争力和客户信任至关重…

STM32和ESP32哪个更适合初学者

对于初学者来说&#xff0c;STM32和ESP32都有各自的优点和适用场景&#xff0c;但考虑到初学者的学习曲线和资源可用性&#xff0c;以下是对两者的一些比较和建议&#xff1a; STM32 优点&#xff1a; 丰富的教程和社区支持&#xff1a;STM32拥有庞大的用户群体和活跃的社区…

图解支付系统的渠道路由设计

大家好&#xff0c;我是隐墨星辰&#xff0c;今天和大家聊聊渠道路由设计。 这篇文章主要讲清楚&#xff1a;渠道路由是什么&#xff0c;为什么需要渠道路由&#xff0c;渠道路由的几种形态&#xff0c;一个简洁而实用的基于规则的渠道路由设计。 注&#xff1a;有些公司称渠…

企业微信H5授权登录

在企业中如果需要在打开的网页里面携带用户的身份信息&#xff0c;第一步需要获取code参数 如何实现企业微信H5获取当前用户信息即accessToken&#xff1f; 1.在应用管理--》创建应用 2.创建好应用&#xff0c;点击应用主页-》设置-》网页-》将授权链接填上去 官方文档可以看…

wampserver的使用

wampserver的使用 文章目录 wampserver的使用1.启动2.目录3.基本操作 1.启动 WampServler有三种状态 服务器关闭状态&#xff0c;颜色为红色服务器开启&#xff0c;但是为离线状态&#xff0c;颜色为橙色&#xff0c;只有本机可以访问服务器开启&#xff0c;在线状态&#xf…

通过Bash脚本执行EXPDP实现本地和异地备份

在 Oracle 数据库管理中,定时执行备份是一个重要的任务,可以保证数据的安全性和可恢复性。本文将介绍如何使用 expdp 工具进行 Oracle 数据库备份,并使用 bash 脚本定时执行备份任务,并对备份文件进行压缩,传输。 准备工作 在执行备份任务之前,需要确保以下几点: 数据…

JAVA:JDK9到21,新特性了解

一、前言 随着Java技术的不断发展和进步&#xff0c;Java开发人员对于新特性的需求也越来越高。从JDK 9到JDK 21&#xff0c;Java发布了一系列重要的更新和改进&#xff0c;以满足开发人员的需求并提高应用程序的性能和安全性。本文将介绍JDK9到JDK 921的核心新特性&#xff0c…

Educational Codeforces Round 166 (Rated for Div. 2)题解(A,B,D)

今天真的巨抽象&#xff0c;第三题没做出来&#xff0c;但是第四题过了&#xff0c;也是准备上小分了&#xff0c;因为nnd不按那个分数&#xff0c;而是按照做题数&#xff0c;直接废了 A. Verify Password 题解&#xff1a;小丑水题一个人&#xff0c;按照ASCII码比较一遍直接…

SDK开发

为什么需要Starter&#xff1f; 理想情况:开发者只需关心调用哪些接口&#xff0c;传递哪些参数就跟调用自己写的代码一样简单。 开发starter的好处&#xff1a;开发者引入之后&#xff0c;可以直接在application.yml中写配置&#xff0c;自动创建客户端。 starter开发流程 …

STM32G030C8T6:EEPROM读写实验(I2C通信)--M24C64

本专栏记录STM32开发各个功能的详细过程&#xff0c;方便自己后续查看&#xff0c;当然也供正在入门STM32单片机的兄弟们参考&#xff1b; 本小节的目标是&#xff0c;系统主频64 MHZ,采用高速外部晶振&#xff0c;实现PB11,PB10 引脚模拟I2C 时序&#xff0c;对M24C08 的EEPRO…

javascript DOM 设置样式

No.内容链接1Openlayers 【入门教程】 - 【源代码示例300】 2Leaflet 【入门教程】 - 【源代码图文示例 150】 3Cesium 【入门教程】 - 【源代码图文示例200】 4MapboxGL【入门教程】 - 【源代码图文示例150】 5前端就业宝典 【面试题详细答案 1000】 文章目录 一、直接…

2965. 找出缺失和重复的数字

2965. 找出缺失和重复的数字 题目链接&#xff1a;2965. 找出缺失和重复的数字 代码如下&#xff1a; class Solution { public:vector<int> findMissingAndRepeatedValues(vector<vector<int>>& grid) {vector<int> nums(grid.size()*grid.siz…

C语言| 求1到100之间奇数的平均值.

【分析思路】 第一种方法 直接遍历100个数字&#xff0c;用 i% 1来判断是不是奇数。 i 是奇数&#xff0c;每次相加&#xff0c;并计算个数。 最后直接求平均数average 1.0*sum / count; 第二种方法 设置变量i 1&#xff0c;每次加2&#xff0c;求奇数&#xff0c;并相加…

【易错题】数据统计补充习题(选择题 )#CDA Level 1

本文整理了数据统计相关的易错题&#xff0c;部分可作为备考CDA Level 1统计学部分的补充习题。来源&#xff1a;如荷学题库&#xff08;CFDP第三部分&#xff09; 1&#xff09; 2&#xff09; 3&#xff09; 4&#xff09; 5&#xff09; 6&#xff09; 7&#xff09; 8&…

shopee签名x-sap-ri、x-sap-sec算法还原

最新版签名&#xff0c;免账号登录成功率百分百&#xff0c;需要可d 两种方式base64 MTQzMDY0OTc3OA QXVndXN0MjItZnF4