HTML静态网页成品作业(HTML+CSS+JS)——动漫斗罗大陆介绍网页(3个页面)

news2024/11/24 5:53:24

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

文章目录

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


一、作品介绍

🏷️本套采用HTML+CSS,使用Javacsript代码实现图片轮播和tab切换,共有3个页面

二、作品演示

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

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<title></title>
	<link rel="stylesheet" href="./css/style.css">
</head>
<body>
	<style>
	</style>
	<div id="wrapper">
		<header>
			<img src="./image/logo.png" alt="">
		</header>
		<nav>
			<a href="index.html">
				动漫首页
			</a>
			<a href="juese.html">
				动漫角色</a>
			<a href="tuji.html">
				动漫图集</a>
		</nav>
		<section class="banner">
			<img data-index="1" src="./image/banner1.jpeg" class="active" alt="">
			<img data-index="2" src="./image/banner2.jpg" alt="">
			<img data-index="3" src="./image/banner3.jpeg" alt="">
		</section>
		
		
		<main>
			<dl class="box">
				<dt>动漫简介</dt>
				<dd>
					<img src="./image/jj.png" style="float: right;margin-left: 10px;" alt="" width="400">
					<p>网络动画《斗罗大陆》改编自中国作家唐家三少原作的同名玄幻小说,由企鹅影视、玄机科技联合出品。于2018120日起每周六10:00在腾讯视频独家正版更新。 于2018年腾讯视频星光盛典荣获年度国漫荣誉。</p>
					<p>唐门外门弟子唐三,因偷学内门绝学为唐门所不容,跳崖明志时却发现没有死,反而以另外一个身份来到了另一个世界,一个属于武魂的世界,名叫斗罗大陆。这里没有魔法,没有斗气,没有武术,却有神奇的武魂。这里的每个人,在自己六岁的时候,都会在武魂殿中令武魂觉醒。武魂有动物,有植物,有器物,武魂可以辅助人们的日常生活。而其中一些特别出色的武魂却可以用来修炼并进行战斗,这个职业,是斗罗大陆上最为强大也是最荣耀的职业“魂师”。</p>
					<p>小小的唐三在圣魂村开始了他的魂师修炼之路,并萌生了振兴唐门的梦想。当唐门暗器来到斗罗大陆,当唐三武魂觉醒,他能否在这片武魂的世界再铸唐门的辉煌……</p>
				</dd>
			</dl>
			<div class="line"></div>
			<dl class="box">
				<dt>动漫评价</dt>
				<dd>
					<p>场面宏大,特效满满,唐门场景和斗罗大陆场景让人惊艳,有可能是迄今为止网文改动漫与翻拍电视剧里最有还原度的场景,将文字中描绘的宏大设定完美的用画面展现出来。</p>
					<p>动作戏精致,山间追逐过程中的几大绝学的展现都有着细致刻画,躲避暗器的动态和镜头追逐也可以看出来制作方下了很大心意。</p>
					<p>
						还原度,动画把原文中重要的内容几乎一分不拉地保留了下来,同时对一些原文描绘不够深入的地方增加了原创内容(唐门长老从小说里的一言不发变成了一路追一路感叹天才,唐三掉下去后和二长老的争执也让这场开幕戏没更加自然地过渡了下来)</p>
					<img src="./image/pj.png" width="100%" alt="">
				</dd>
			</dl>
		</main>
		
		<footer>
			斗罗大陆 版权所有
		</footer>
	</div>
	<script src="./js/script.js"></script>
</body>
</html>

五、源码获取

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

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

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

相关文章

24.3K star!一个轻量级且高度可配置的现代化命令行文本编辑器

大家好&#xff0c;今天给大家分享的是一个轻量级且高度可配置的现代化命令行文本编辑器。 micro 是一个轻量级且高度可配置的命令行文本编辑器&#xff0c;以其简洁的设计和强大的插件系统著称。该项目强调速度与效率&#xff0c;适合那些追求快速编辑体验并希望保持系统资源占…

ISO14001认证:引领企业迈向绿色未来

在当今全球环境日益恶化的背景下&#xff0c;绿色发展已成为企业和社会共同追求的目标。ISO14001环境管理体系作为由国际标准化组织&#xff08;ISO&#xff09;制定的环境管理国际标准&#xff0c;为企业提供了系统和全面的环境管理框架&#xff0c;适用于各种类型和规模的组织…

TurboWarp简单介绍

1.为什么要下载TurboWarp&#xff1f; 2.下载TurboWarp 在线版&#xff1a;TurboWarp - Run Scratch projects faster 离线版下载&#xff1a;TurboWarp Desktop - Better offline editor for Scratch 3 3.使用 界面&#xff1a; 功能&#xff1a; 上方功能条&#xff1a;…

【办公技巧】如何编辑带有限制编辑密码的PDF文件?

PDF文件打开之后发现设置了限制编辑&#xff0c;功能栏中的编辑按钮都是灰色的&#xff0c;导致PDF文件里的内容无法编辑。那么带有限制编辑的PDF文件&#xff0c;如何编辑&#xff1f;今天分享两个方法。 方法一&#xff1a; 我们可以将PDF文件转换成其他格式&#xff0c;有…

御道源码(ruoyi-vue-pro)个人使用小结

御道源码&#xff08;ruoyi-vue-pro&#xff09;个人使用小结 一、Git地址 1、平台项目简介及地址 2、开发指南&#xff0c;如图所示&#xff0c;部分功能需要收费&#xff0c;可自行了解 二、项目文件夹结构示例&#xff1a; 三、技术介绍 1.基于 Spring Boot MyBatis P…

【CT】LeetCode手撕—415. 字符串相加

目录 题目1- 思路2- 实现⭐415. 字符串相加——题解思路 3- ACM 实现 题目 原题连接&#xff1a;415. 字符串相加 1- 思路 模式识别&#xff1a;字符串相加 逆向遍历过程模拟 数据结构 ① String res &#xff1a;记录res 、② carry 记录进位值① 定义两个整数遍历 nums1 …

算法篇-二叉树

二叉树的遍历 分为前序、中序和后续的遍历&#xff0c;思想就是利用递归。 前序遍历-中左右 代码&#xff1a; public void travelTree(TreeNode node, List<Integer> resulst) {if (node null){return;}// 中resulst.add(node.val);// 左travelTree(node.left, resul…

Hive笔记-4

240618-Hive笔记-4 4.2 Insert 4.2.1 将查询结果插入表中 1) 语法 INSERT (INTO | OVERWRITE) TABLE tablename [PARTITION (partcol1val1,partcol2val2 ...)] select_stamement; 关键字说明: (1) INTO: 将结果追加到目标表 (2) OVERWRITE: 用结果覆盖原有数据 2) 案例…

如何使用代理ip上网移动转电信

在一些特定的工作场景中&#xff0c;比如跨网办公、数据分析等&#xff0c;我们常常需要将网络IP从一种类型转换到另一种类型。如需将移动网络转电信IP代理。那么&#xff0c;如何使用代理IP上网移动转电信呢&#xff1f;接下来&#xff0c;将为您揭示一个便捷的方法&#xff0…

火车头采集器Typecho采集发布模块插件

火车头采集器发布数据到Typecho系统网站应该怎么操作&#xff1f; 1. 火车头采集器Typecho采集发布插件下载安装&#xff1a; 火车头采集器Typecho采集发布模块插件下载地址-CSDN 2. 在火车头采集器软件导Typecho采集发布模块插件&#xff1b; 3. 填写Typecho系统文章对应的…

【Java】已解决java.lang.FileNotFoundException异常

文章目录 一、分析问题背景二、可能出错的原因三、错误代码示例四、正确代码示例五、注意事项 已解决java.lang.FileNotFoundException异常 在Java编程中&#xff0c;java.lang.FileNotFoundException是一个常见的异常&#xff0c;它通常表示程序试图打开一个不存在的文件、文…

ROS机器人虚拟仿真挑战赛持续学习笔记-20240619

cartographer 需要全手工编译……比较麻烦。 如果使用新版ceres-solver&#xff0c;版本2.x&#xff0c;需要修改源码&#xff0c;部分“接口代码”有改动。 稳妥使用ceres-solver-1.13.0&#xff0c;且需要安装abseil-cpp。 验证是否成功&#xff0c;使用roscd或roslaunch…

React+TS前台项目实战(十二)-- 全局常用组件Toast封装,以及rxjs和useReducer的使用

文章目录 前言Toast组件1. 功能分析2. 代码详细注释&#xff08;1&#xff09;建立一个reducer.ts文件&#xff0c;用于管理状态数据&#xff08;2&#xff09;自定义一个清除定时器的hook&#xff08;3&#xff09;使用rxjs封装全局变量管理hook&#xff08;4&#xff09;在to…

Java 图书管理系统功能实现

承接上一篇的 图书管理系统 &#xff0c;点击这里跳转 要实现什么功能 1.查找图书 2.增加图书 3.删除图书 4.展示图书 5.退出系统 6.借阅图书 7.归还图书 1.查找图书 要完成这个功能需要以下步骤 输入书名&#xff0c; 然后在书架里找到这本书打印出来&#xff0c;…

安装CDH时报错:Parcel 不可用于操作系统分配 RHEL7,原因与解决办法~

报错信息&#xff1a; 解决办法与思路&#xff1a; 1、检查CDH包的后缀名称&#xff0c;Redhat与Centos安装时不需要修改后缀名称&#xff0c;麒麟系统安装时才需要修改。 2、目录里面需要有xxx.parcel xxx.parcel.sha manifest.json 三个文件 缺一不可&#xff08;注&#x…

储能电池竞争出海分析

锂电池的激烈竞争进一步蔓延到储能行业。为保市场份额和现金流稳定&#xff0c;不少储能电池企业都开始大幅度降低报价只求中标储能项目。 随着6月的储能电芯的最高限价和系统报价都已经贴近成本价&#xff0c;一二三线的储能电池厂商将要如何应对&#xff1f; 1、储能规模快速…

前端核心框架Vue指令详解

目录 ▐ 关于Vue指令的介绍 ▐ v-text与v-html ▐ v-on ▐ v-model ▐ v-show与v-if ▐ v-bind ▐ v-for ▐ 前言&#xff1a;在学习Vue框架过程中&#xff0c;大家一定要多参考官方API &#xff01; Vue2官方网址https://v2.cn.vuejs.org/v2/guide/ ▐ 关于Vue指令的…

第五篇:构建与维护私有Docker Registry: 企业级实践指南

构建与维护私有Docker Registry: 企业级实践指南 1. 引言&#xff1a;解析私有Docker仓库的必要性 1.1 Docker Registry简介与私有化的好处 Docker Registry是一个用于存储和分发Docker镜像的系统。在Docker生态系统中&#xff0c;Registry扮演着至关重要的角色&#xff0c;为…

MySQL 面试突击指南:核心知识点解析2

事务并发可能引发的问题 MySQL 是一个客户端/服务器架构的软件,对于同一个服务器来说,可以有多个客户端与之连接,每个客户端与服务器连接后,可以称为一个会话(Session)。每个客户端都可以在自己的会话中向服务器发出请求语句,一个请求语句可能是某个事务的一部分,也就…

DPDK的Cache预取和Cache一致性

1.什么是Cache预取 众所周知&#xff0c;CPU访问Cache中的数据是比访问内存中的数据是要快的&#xff0c;而因为程序都有时间局部性和空间局部性&#xff0c;时间局部性简单来说就是某一条或几条指令在一段时间内会被CPU多次执行&#xff1b;空间局部性简单来说就是某一段数据块…