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

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

文章目录


一、作品介绍

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

二、作品演示




三、代码目录

四、网站代码

HTML部分代码

c 复制代码
<!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.想要获取本文源码,点击前往吧

相关推荐
NoneCoder14 分钟前
HTML 模板技术与服务端渲染
服务器·servlet·html
码农研究僧29 分钟前
Vue3 上传后的文件智能预览(实战体会)
vue·html·图片预览
三巧38 分钟前
纯CSS吃豆人(JS仅控制进度)
javascript·css·html
李詹40 分钟前
Steam游戏服务器攻防全景解读——如何构建游戏级抗DDoS防御体系?
服务器·游戏·ddos
软件技术NINI1 小时前
html css js网页制作成品——HTML+CSS+js美甲店网页设计(5页)附源码
javascript·css·html
街尾杂货店&1 小时前
css word
前端·css
NoneCoder4 小时前
HTML与Web 性能优化:构建高速响应的现代网站
前端·性能优化·html
换日线°4 小时前
CSS常遇到自适应高度动画、带三角气泡阴影一行样式解决
css·微信小程序
爱上大树的小猪5 小时前
【前端基础】viewport 元标签的详细参数解析与实战指南
前端·css·面试
喵爱吃鱼5 小时前
Flex布局和省略号
前端·css·flexbox