HTML静态网页成品作业(HTML+CSS)——动漫海贼王介绍网页(1个页面)

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

文章目录

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


一、作品介绍

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

二、作品演示

在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码


<header class="logo ">
				<img src="./images/logo.png" alt="">
			</header>
			<!-- 展示图片 -->
			<div class="show ">
				<img src="./images/banner.jpeg" alt="">
			</div>
			<!-- 前言 -->
			<div class="content ">
				<h2>简介</h2>
				<div class="title">
					<p>
						拥有财富、名声、权力,这世界上的一切的男人 “海贼王”哥尔·D·罗杰,在被行刑受死之前说了一句话,让全世界的人都涌向了大海。“想要我的宝藏吗?如果想要的话,那就到海上去找吧,我全部都放在那里。”,世界开始迎接“大海贼时代”的来临 
					</p>
					<p>
						时值“大海贼时代”,为了寻找传说中海贼王罗杰所留下的大秘宝“ONE PIECE”,无数海贼扬起旗帜,互相争斗。有一个梦想成为海贼王的少年叫路飞,他因误食“恶魔果实”而成为了橡皮人,在获得超人能力的同时付出了一辈子无法游泳的代价。十年后,路飞为实现与因救他而断臂的香克斯的约定而出海,他在旅途中不断寻找志同道合的伙伴,开始了以成为海贼王为目标的冒险旅程。
					</p>
					<p>
						<img src="./images/a1.png" alt="">
					</p>
				</div>
				<h2>视频</h2>
				<div class="title">
					<p>
						<video src="./video/1.mp4" controls width="100%"></video>
					</p>
				</div>
			</div>

五、源码获取

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

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

超分论文走读

codeFormer 原始动机 高度不确定性&#xff0c;模糊到高清&#xff0c;存在一对多的映射纹理细节丢失人脸身份信息丢失 模型实现 训练VQGAN 从而得到HQ码本空间作为本文的离散人脸先验。为了降低LQ-HQ映射之间的不确定性&#xff0c;我们设计尽量小的码本空间和尽量短的Code…

人人都是产品经理,尼恩产品经理面试宝典(史上最全、定期更新)

《人人都是产品经理&#xff0c;尼恩产品经理面试宝典》&#xff08;史上最全、定期更新&#xff09; 本文版本说明&#xff1a;V1 IT不老新物种 的定义 大龄男IT &#xff1a;APM 架构经理 项目经理 高级开发&#xff0c;没有中年危机 大龄女IT&#xff1a;DPM 产品经理 …

Simulink从0搭建模型07-P8for循环的使用

Simulink从0搭建模型07-P8for循环的使用 今日学习内容1. For Iterator Subsystem模块介绍1.1. 累加器1.2. For Iterator1.3.小结 2. states介绍3. Set next i&#xff08;相当break)学习心得 今日学习内容 b站视频 【Simulink 0基础入门教程 P8 for循环的使用 For Itrator Sub…

Power Bi 自定义进度条,圆角框,矩阵图标的实现

最近项目在做Power BI&#xff0c;我总结了几个常用的自定义样式&#xff0c;分享一下做法。 比如我们要实现如图这样的一个样式&#xff1a; 这包含了一个带文字的自定义进度条&#xff0c;矩阵有树型展开以及图标显示&#xff0c;最外面有圆角框包围。我觉得这几个样式出现…

ATA-2021B高压放大器在锂电池超声检测中的应用

锂电池一种高能量密度的电池&#xff0c;已经广泛应用于可穿戴设备、移动电话、笔记本电脑和电动汽车等领域中。然而&#xff0c;其在使用过程中存在着一定的安全隐患&#xff0c;锂电池内部的化学反应和充放电过程可能会导致电池发热&#xff0c;甚至发生燃烧。Aigtek安泰电子…

走进数字艺术的世界:一种创新的艺术表达方式

进入数字时代&#xff0c;计算机将我们生活的方方面面都进行了转化。当然艺术领域也不例外。随着数字技术和计算机程序的发展和普及&#xff0c;“数字艺术”的概念应试而生。那么&#xff0c;所谓的数字艺术到底是什么呢&#xff1f;数字艺术的作用是什么&#xff1f;新手如何…

在项目中集成Web端数据库操作:推荐工具一览

在项目中集成Web端数据库操作&#xff1a;推荐工具一览 博主猫头虎的技术世界 &#x1f31f; 欢迎来到猫头虎的博客 — 探索技术的无限可能&#xff01; 专栏链接&#xff1a; &#x1f517; 精选专栏&#xff1a; 《面试题大全》 — 面试准备的宝典&#xff01;《IDEA开发秘籍…

基于分块贝叶斯非局部均值优化(OBNLM)的图像去噪算法matlab仿真

目录 1.程序功能描述 2.测试软件版本以及运行结果展示 3.核心程序 4.本算法原理 4.1 块定义与相似度计算 ​4.2 贝叶斯框架下的加权融合 4.3 加权最小均方误差估计 5.完整程序 1.程序功能描述 基于分块贝叶斯非局部均值优化(OBNLM)的图像去噪算法matlab仿真&#xff0c…

CASS+arcgis实现图斑的分割

1、在CASS中将图形绘制好&#xff0c;待分割图形为闭合线&#xff0c;使用线段将其分割成很多块&#xff0c;如下&#xff1a; 2、保存文件。打开arcgisPro&#xff0c;加载dwg图形&#xff0c;如下&#xff1a; 效果如下&#xff1a; 3、分别将面和线导出&#xff0c;如下&…

FL Studio21.2.5中文版电子音乐制作的强大工具

在当今的数字音乐时代&#xff0c;电子音乐已经成为了全球音乐市场中不可或缺的一部分。越来越多的音乐爱好者开始尝试自己动手创作电子音乐&#xff0c;而FL Studio 21中文版正是为他们量身打造的一款强大工具。作为一个音频制作爱好者&#xff0c;我深知一个好的数字音频工作…

LeetCode热题100 Day1——双指针

双指针 移动零11. 盛最多水的容器 移动零 思路&#xff1a; 双指针i&#xff0c;j&#xff0c;j指针遍历数组&#xff0c;i指针存放非0元素。遍历结束后&#xff0c;i指针及其后面的一定是0,就再将空出来的位置设置为0 移动零 class Solution {public void moveZeroes(int[] …

PPT忘记保存?教你如何轻松恢复

在日常办公中PPT文件作为主流文档格式&#xff0c;承载着我们大量的工作成果。然而当不小心误点了“不保存”按钮&#xff0c;或是遭遇软件崩溃等意外情况导致文档丢失时&#xff0c;文件内容是否还能够能恢复&#xff0c;往往成为我们最关心的问题。本文将为您提供五大免费且实…

Centos安装nvm管理node版本(让安装变得可控又快捷)

Centos安装nvm管理node版本&#xff08;让安装变得可控又快捷&#xff09; 没有找到一个对的人&#xff0c;有可能是你没有走对那条路&#xff0c;也有可能是你没有睁开眼睛&#xff0c;而更大的可能是&#xff0c;你根本就没有出发去找。 安装说明 nvm安装目录&#xff1a;/us…

vue项目出现多次ElMessage

问题&#xff1a; 解决方法&#xff1a; let message null if (message null) { message ElMessage.error(“登录过期,请重新登录”); } 最终效果&#xff1a;只出现一个弹框

N进制计数器【02】

大容量N进制计数器 集成计数器容量的扩展 集成计数器级联扩展容量 【例1】由两片 74LS161 级联组成 256 进制&#xff08;8位二进制&#xff09;同步加法计数器 【解】级联时&#xff0c;外加时钟信号同时接到各片计数器的时钟输入端&#xff0c;用前级计数器的进位输出 C…

蓝硕硬盘数据恢复方法详解:安全、高效的解决方案

在数字化时代&#xff0c;硬盘作为我们存储和传输数据的重要载体&#xff0c;其数据安全性显得尤为重要。然而&#xff0c;无论是由于误操作、硬件故障还是病毒攻击&#xff0c;硬盘数据丢失的风险始终存在。蓝硕硬盘作为市场上的一款知名产品&#xff0c;其数据恢复同样是我们…

突破空间限制,这些远程控制软件为父母送上“手把手”的教导,解决异地办公难题,出差无忧

在现代社会&#xff0c;科技的飞速发展带来了诸多便利&#xff0c;但同时也给一些年长的父母们带来了困扰。 当父母们面对智能手机电脑等高科技产品时&#xff0c;他们往往感到无所适从&#xff0c;而子女们忙于工作、学习或其他原因&#xff0c;常常无法时刻陪伴在父母身边&a…

【Unity iOS打包】Library not loaded: ‘@rpath/AdjustSdk.framework/AdjustSdk‘

Unity打包iOS&#xff0c;XCode运行App黑屏卡死&#xff0c;报错&#xff1a; dyld[8412]: Library not loaded: rpath/AdjustSdk.framework/AdjustSdkReferenced from: /private/var/containers/Bundle/Application/C019F943-138F-4B33-AAC1-F18453F942D9/AnimalsBAMBAM.app/…

手写promise、call、apply、debounce、throttle 等

1、promise 1.1 实现resolve和reject class MyPromise {// 构造方法constructor(executor) {// 初始化值this.initValue()// 初始化this指向this.initBind()try {// 执行传进来的函数executor(this.resolve, this.reject)} catch (e) {// 捕捉到错误直接执行rejectthis.rejec…

Gartner发布评估威胁情报计划有效性指南:评估威胁情报有效性的四个步骤

许多组织都在努力实施 TI 并评估其价值。安全和风险管理领导者必须使用优先情报要求来评估其 TI 计划的有效性&#xff0c;并根据其组织战略完善该计划。 主要发现 尽管许多组织已将威胁情报 (TI) 纳入其安全计划&#xff0c;但他们很难评估其性能、成熟度以及在相关产品和服务…