HTML静态网页成品作业(HTML+CSS)——游戏阴阳师介绍网页(4个页面)

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

文章目录

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


一、作品介绍

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

二、作品演示

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

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>阴阳师</title><link rel="stylesheet" type="text/css" href="./css/style.css">
</head>
<body><div class="wrapper"><!-- 头部 --><div class="header"><div class="logo"><img src="./images/logo.jpeg"></div><div class="nav"><a href="index.html" class="active">游戏首页</a><a href="tupian.html" >精彩图片</a><a href="pingjia.html" >游戏评价</a><a href="login.html">我要登录</a></div></div><div class="banner"><img src="./images/banner.jpg"></div><div class="main"><h2>游戏背景</h2><p>故事发生在人鬼共生的年代,原本属于阴界的魑魅魍魉,潜藏在人类的恐慌中伺机而动,阳界的秩序岌岌可危。幸而世间有着一群懂得观星测位、画符念咒,还可以跨越阴阳两界,甚至支配灵体的异能者,他们正各尽所能,为了维护阴阳两界的平衡赌上性命战斗并被世人尊称为“阴阳师”  。</p><h2>游戏角色</h2><table border="1" ><tr><td><img src="./images/1.png"></td><td><h4>晴明</h4><p>平安时代强大的阴阳师,性格冷峻飘逸。拥有忠诚的守护式神——小白,并先后认识了神乐、源博雅和八百比丘尼三位伙伴。</p></td></tr><tr><td><img src="./images/2.png"></td><td><h4>神乐</h4><p>源氏的后代,性格单纯善良,具备通灵能力,被晴明遇到带回庭院。</p></td></tr><tr><td><img src="./images/3.png"></td><td><h4>源博雅</h4><p>平安时代贵族,是皇室之后,同时也是一名武士。性格孤傲爽直,善用大弓,其弓箭具有射杀妖怪之力。从小桀骜不驯,喜欢冒险与挑战。遇到晴明和神乐之后,便经常光顾庭院。</p></td></tr><tr><td><img src="./images/4.png"></td><td><h4>八百比丘尼</h4><p>误食人鱼肉不老不死,已活了几百年的神秘巫师。占卜到晴明是命中注定可以帮助其解除诅咒之人,便居住在凤凰林中等待晴明,后来便一直留在庭院。</p></td></tr></table></div><!-- 底部 --><div class="footer"><div>阴阳师 版权所有</div></div></div>
</body>
</html>

五、源码获取

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

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

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

相关文章

Android ANR简介

ANR&#xff08;App not respond&#xff09;是Android定义的一种稳定性问题类型&#xff1b;系统发出关键消息&#xff0c;同时发出此消息的超时消息。处理逻辑有两种情况&#xff1a; 关键消息被执行&#xff0c;超时消息被清除&#xff1b;ANR不会发生超时消息被执行&#x…

JAVASE2

封装的步骤&#xff1a; 1、所有属性私有化&#xff0c;使用private关键字进行修饰&#xff0c;private表示私有的&#xff0c;修饰的所有数据只能在本类中访问 2、对外提供简单入口&#xff1a;比如说被private修饰的成员变量&#xff0c;在其他类中只能通过getXxx/setXxx方法…

网络风暴:揭秘DDoS攻击的幕后黑手

在数字化时代的浪潮中&#xff0c;网络攻击已成为一种新型的战争手段。其中&#xff0c;分布式拒绝服务攻击&#xff08;DDoS&#xff09;以其强大的破坏力和隐蔽性&#xff0c;成为网络安全领域的一大挑战。DDoS攻击通过发动海量的恶意流量&#xff0c;如同狂风暴雨般席卷目标…

如何设置远程桌面连接?

远程桌面连接是一种方便快捷的远程访问工具&#xff0c;可以帮助用户在不同地区间快速组建局域网&#xff0c;解决复杂网络环境下的远程连接问题。本文将针对使用远程桌面连接的操作步骤进行详细介绍&#xff0c;以帮助大家快速上手。 步骤一&#xff1a;下载并安装远程桌面连接…

芯片丝印反查

芯片丝印反查网 - IC芯片丝印,IC芯片代码,IC芯片印字,IC芯片顶标,SMD code,marking code,top mark芯查查-电子信息产业数据引擎 ic/芯片丝印反查网-芯查查

各种情况下的线缆大小选择

开口线鼻子和导线对应大小 开口铜鼻子对应线径大小 变压器容量对应高压侧电流大小 开关电流线缆功率对照表 家庭/工业最常用电线铜线电流承载功率 电工常用名词对应符号 导线面积承载的安全载流量及允许负荷对照表 漏电保护器选择参考表 电动机功率换算电流 电机功…

Python正则模块re方法介绍

Python 的 re 模块提供了多种方法来处理正则表达式。以下是一些常用的方法及其功能介绍&#xff1a; 1. re.match() 在字符串的开始位置进行匹配。 import repattern r\d string "123abc456"match re.match(pattern, string) if match:print(f"匹配的字符…

代码随想录——最大二叉树(Leetcode654)

题目链接 递归 二叉树 /*** Definition for a binary tree node.* public class TreeNode {* int val;* TreeNode left;* TreeNode right;* TreeNode() {}* TreeNode(int val) { this.val val; }* TreeNode(int val, TreeNode left, TreeNode rig…

.NET 轻量级、高效任务调度器:ScheduleTask

前言 至于任务调度这个基础功能&#xff0c;重要性不言而喻&#xff0c;大多数业务系统都会用到,世面上有很多成熟的三方库比如Quartz&#xff0c;Hangfire&#xff0c;Coravel 这里我们不讨论三方的库如何使用 而是从0开始自己制作一个简易的任务调度,如果只是到分钟级别的粒…

全能集成开发平台Team·IDE

三甲医院的床位太难等了。反正也是小手术&#xff0c;老苏周五在附近找了家二甲医院&#xff0c;幸运的是&#xff0c;门诊迅速为我开具了入院证。周六早晨就接受了手术&#xff0c;周日挂了一天水&#xff0c;周一下午就出院了。准备在家先休息两天。 2~4 周之后把支架取出来…

阿里云海外视频安全的DRM加密

随着科技的进步&#xff0c;视频以直播或录播的形式陆续开展海外市场&#xff0c;从而也衍生出内容安全的问题&#xff0c;阿里云在这方面提供了完善的内容安全保护机制&#xff0c;适用于不同的场景&#xff0c;如在视频安全提供DRM加 由图可以了解到阿里云保护直播安全的方法…

Java的 File类

Java的 File类 File类&#xff1a;相关方法&#xff1a;构造方法&#xff1a;创建文件/目录&#xff1a;重命名&#xff1a;判断&#xff1a;获取&#xff1a;删除&#xff1a; 路径&#xff1a;相关操作&#xff1a;操作1&#xff1a;目录存在&#xff1a;一层级的目录不存在:…

c++模板与泛型编程

模板的作用&#xff1a;通过使用模板降低重复代码的编写&#xff0c;把已经写好的代码作用最大化&#xff1b; 模板的概念 1.模板与泛型编程&#xff08;目的时只进行逻辑操作&#xff0c;不需要考虑数据类型&#xff0c;将类型作为参数传递&#xff09; 模板是实现代码重用…

【软件设计师】程序语言

1.程序设计语言基本概念 1.1 低级语言与高级语言 低级语言&#xff1a;机器语言和汇编语言称为低级语言 机器语言指0.&#xff0c;1组成的机器指令序列 汇编语言指用符号表示指令的语言&#xff0c;如MOV AX&#xff0c;2 高级语言&#xff1a;从人类的逻辑角度出发&#xff0…

numpy-mkl的下载地址

不要使用pip3直接在终端安装&#xff0c;因为pip3默安装的是numpy&#xff0c;而不是numpymkl。 采用在第三方库中手动下载后&#xff0c;再安装的方式。 第三方库网址&#xff1a;https://www.lfd.uci.edu/~gohlke/pythonlibs/#numpy 如果不能进入就可以选择去git里面&#x…

(三)MobaXterm、VSCode、Pycharm ssh连接服务器并使用

背景&#xff1a;根据前两篇文章操作完成后&#xff0c; 手把手教学&#xff0c;一站式安装ubuntu及配置服务器-CSDN博客 手把手教学&#xff0c;一站式教你实现服务器&#xff08;Ubuntu&#xff09;Anaconda多用户共享-CSDN博客 课题组成员每人都有自己的帐号了&#xff0…

嵌入式0基础开始学习 Ⅲ Linux基础(3)正则表达式

0.问题引入 字符串是计算机应用中最为广泛的处理对象之一(浏览器&#xff0c;xml文件&#xff0c;代码) 并且字符串的组合规则形式各种各样&#xff0c;如&#xff1a; 数字字符串 email字符串 IP地址字符串 网址 …

互联网政务应用安全管理规定:使用安全连接方式访问

前几日&#xff0c;由中央网络安全和信息化委员会办公室、中央机构编制委员会办公室、工业和信息化部、公安部等4部门联合制定的《互联网政务应用安全管理规定》&#xff08;以下简称规定&#xff09;发布了&#xff0c;规定定义了互联网政务应用&#xff0c;也对互联网政务应用…

Android数据缓存框架 - 内存数据载体从LiveData到StateFlow

引言&#xff1a;所有成功者的背后&#xff0c;都有一份艰苦的历程&#xff0c;不要只看到了人前的风光&#xff0c;而低估了他们背后所付出的努力。 随着flow到流行度越来越高&#xff0c;有开发者呼吁我使用flow&#xff0c;于是我就如你们所愿&#xff0c;新增了StateFlow作…

智能时代下,人机交互和虚拟现实的机遇和挑战

智能时代下,人机交互和虚拟现实的机遇和挑战