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

news2024/11/17 1:38:19

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

文章目录

  • 一、作品介绍
  • 二、作品演示
  • 三、代码目录
  • 四、网站代码
    • 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.coloradmin.cn/o/1711192.html

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

相关文章

RDP方式连接服务器上传文件方法

随笔 目录 1. RDP 连接服务器 2. 为避免rdp 访问界面文字不清晰 3. 本地上传文件到服务器 1. RDP 连接服务器 # mstsc 连接服务器step1: 输入mstscstep2: 输入 IP, username, passwd 2. 为避免rdp 访问界面文字不清晰 解决方法&#xff1a; 3. 本地上传文件到服务器 step…

《KAN》论文笔记

原文出处 KAN: Kolmogorov–Arnold Networks (arxiv.org)https://arxiv.org/html/2404.19756v1 论文笔记 What 《KAN: Kolmogorov–Arnold Networks》——我们提出了 KolmogorovArnold Networks (KANs) 作为多层感知器 (MLP) 的有前途的替代方案。 我们表明&#xff0c;这…

小程序自动化辅助渗透脚本(2024)

简介 1.还在一个个反编译小程序吗&#xff1f; 2.还在自己一个个注入hook吗&#xff1f; 3.还在一个个查看找接口、查找泄露吗&#xff1f; 现在有自动化辅助渗透脚本了&#xff0c;自动化辅助反编译、自动化注入hook、自动化查看泄露 注&#xff1a;本工具仅用于学习交流&…

数据库系统概论(个人笔记)(第三部分)

数据库系统概论&#xff08;个人笔记&#xff09; 文章目录 数据库系统概论&#xff08;个人笔记&#xff09;3、SQL介绍3.1 SQL查询语言概述3.2 SQL数据定义3.3 SQL查询的基本查询结构3.4 其他基本操作3.5 设置操作3.6 空值3.7 聚合函数3.8 嵌套子查询3.9 数据库的修改 3、SQL…

VSCODE常用插件记录

重点提名&#xff1a; back & ForthBookmarksC/ChighlightSSH FS //SSH插件

SQL2017附加从其他电脑复制过来的mdf数据后出现【只读】无法写入数据

1. 尝试给它所在的文件夹的属性中的“只读”去勾&#xff0c;无果。 2. 其他文章提示是文件的问题。 该错误为文件权限错误&#xff0c;找到该数据库的 数据库文件 和 日志文件&#xff0c;在安全中添加 Authenticated Users 用户的权限&#xff0c;并设置 “完全控制”

Linux:进程控制(二.详细讲解进程程序替换)

上次讲了&#xff1a;Linux&#xff1a;进程地址空间、进程控制&#xff08;一.进程创建、进程终止、进程等待&#xff09; 文章目录 1.进程程序替换1.1概念1.2原理1.3使用一个exec 系列函数execl&#xff08;&#xff09;函数结论与细节 2.多进程时的程序替换3.其他几个exec系…

【链表】Leetcode 82. 删除排序链表中的重复元素 II【中等】

删除排序链表中的重复元素 II 给定一个已排序的链表的头 head &#xff0c; 删除原始链表中所有重复数字的节点&#xff0c;只留下不同的数字 。返回 已排序的链表 。 示例 1&#xff1a; 输入&#xff1a;head [1,2,3,3,4,4,5] 输出&#xff1a;[1,2,5] 解题思路 由于链表…

【小呆的力学笔记】连续介质力学的知识点回顾一:运动和变形

文章目录 1. 运动的描述2. 拉格朗日描述下的变形2.1 线元的变化2.2 体元的变化2.3 面元的变化 1. 运动的描述 在连续介质力学中&#xff0c;存在着两种对运动的描述&#xff0c;一种为拉格朗日描述&#xff0c;即通过描述每个物质点的运动来描述整个变形体的运动&#xff0c;也…

电脑如何远程访问?

【天联】的使用场景 电脑远程访问在现代科技的发展中扮演了重要的角色。对于企业和个人用户来说&#xff0c;远程访问的便利性提供了许多机会和可能性。作为一种高效的工具&#xff0c;【天联】具有广泛的应用场景&#xff0c;可以实现异地统一管理、协同办公以及远程数据采集…

一文了解MyBatis

文章目录 MyBatis1. MyBatis的执行流程2. MyBatis是否支持延迟加载3. MyBatis延迟加载的底层原理4. MyBatis的二级缓存机制用过吗5. 谈谈MyBatis框架的优势6. 简单描述MyBatis的工作原理7. MyBatis中的sql标签8. MyBatis中的${}和#{}的区别9. MyBatis中ResulyMap的作用[重要]10…

在Python中实现限定抽奖次数的机制

目录 一、引言 二、需求分析 三、设计思路 四、代码实现 4.1 使用字典存储用户抽奖次数 4.2 使用数据库存储用户抽奖次数 五、扩展与优化 六、总结 一、引言 在当今互联网应用中&#xff0c;抽奖系统作为吸引用户、提高用户参与度和活跃度的重要手段&#xff0c;已经被…

展望跨境智慧银行在全球化金融服务中的发展趋势和机遇

一、引言 随着全球经济的不断融合和金融科技的迅猛发展,跨境智慧银行作为连接不同国家和地区金融市场的桥梁,正逐渐展现出其独特的魅力和潜力。跨境支付与结算作为跨境智慧银行的核心业务之一,随着全球化的深入发展和国际贸易的日益频繁,其业务场景也愈发丰富和复杂。本文…

【智能算法应用】灰狼算法GWO求解三维路径规划问题

目录 1.算法原理2.三维路径规划数学模型3.结果展示4.参考文献5.代码获取 1.算法原理 【智能算法】灰狼算法&#xff08;GWO&#xff09;原理及实现 2.三维路径规划数学模型 三维地形可以等效处理成山峰地形&#xff0c;数学模型为: z ( x , y ) h 0 ∑ j 1 N h j max ⁡…

Vitis HLS 学习笔记--块级控制协议-ap_ctrl_chain/ap_ctrl_hs/ap_ctrl_none

目录 1. 简介 2. 详细分析 2.1 使用场景区别 2.2 ap_continue 行为详解 2.3 ap_ctrl_chain 行为详解 3. 总结 1. 简介 块级控制协议允许硬件模块表明&#xff1a; 何时可以开始处理数据。何时完成了数据处理。以及何时处于空闲状态&#xff0c;准备接受新的数据输入。 …

【放球问题】920. 播放列表的数量

本文涉及知识点 【组合数学 隔板法 容斥原理】放球问题 本题同解 【动态规划】【组合数学】【C算法】920播放列表的数量 LeetCode 920. 播放列表的数量 你的音乐播放器里有 n 首不同的歌&#xff0c;在旅途中&#xff0c;你计划听 goal 首歌&#xff08;不一定不同&#x…

冯喜运:5.29市场避险情绪升温,黄金原油小幅收涨

【黄金消息面分析】&#xff1a;周二&#xff08;5月28日&#xff09;美盘时段&#xff0c;由于美元走弱且市场情绪出现负面变化&#xff0c;黄金收复早前跌幅&#xff0c;站上2350美元关口。金价早盘一度走弱&#xff0c;源于美联储降息可能性降低带来压力&#xff0c;投资者在…

工作软件新宠儿

想要让你的工作效率飞起来吗&#xff1f;&#x1f440; 是时候告别那些大众化的工作软件啦&#xff01;今天&#xff0c;我要给大家种草几款不常见的但超级实用的工作软件&#x1f331;&#xff0c;保证让你事半功倍哦&#xff01;&#x1f31f; 1️⃣ 亿可达 它是一款自动化…

基于ssm的微信小程序的居民健康监测系统

采用技术 基于ssm的微信小程序的居民健康监测系统的设计与实现~ 开发语言&#xff1a;Java 数据库&#xff1a;MySQL 技术&#xff1a;SpringMVCMyBatis 工具&#xff1a;IDEA/Ecilpse、Navicat、Maven 页面展示效果 后端页面 用户信息管理 健康科普管理 公告管理 论坛…

读人工智能时代与人类未来笔记17_人类未来

1. 人类未来 1.1. 在印刷读物出现之前&#xff0c;中世纪的欧洲人主要通过社区传统获取知识 1.1.1. 通过参与收割和季节轮作积累民间智慧 1.1.2. 在礼拜场所践行信仰并遵守圣礼 1.1.3. 加入行业公会&#xff0c;学习技术&…