HTML静态网页成品作业(HTML+CSS)——电影加勒比海盗介绍设计制作(1个页面)

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

文章目录

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


一、作品介绍

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

二、作品演示

在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>加勒比海盗</title>
	<link rel="stylesheet" href="./css/style.css">
</head>
<body>
	<div class="w">
		<div class="banner">
			<h1>加勒比海盗系列电影</h1>
			<p>奇幻 / 冒险 / 动作</p>
		</div> 
		<div class="main">
			<img src="img/main.png" alt="">
		</div>
		<div class="content fu">
			<div class="left">
				<div class="tu">
					<img src="img/1.jpg" class="ac" alt="">
				</div>
			</div>
			
			
			<div class="right">
				<div class="cast">
					<h2>演员表</h2>
					<div class="tx">
						<img src="img/tx-1.jpg" alt="">
						<img src="img/tx-2.jpg" alt="">
						<img src="img/tx-3.jpg" alt="">
						<img src="img/tx-4.jpg" alt="">
						<img src="img/tx-5.jpg" alt="">
						<img src="img/tx-6.jpg" alt="">
						<img src="img/tx-7.jpg" alt="">
						<img src="img/tx-8.jpg" alt="">
					</div>
					<p>约翰尼·德普、杰弗里·拉什、奥兰多·布鲁姆、凯拉·奈特莉、杰克·达文波特、乔纳森·普雷斯、李·阿伦伯格、马丁·科勒巴、乔迪·卡巴勒罗、大卫·拜利、露欣达·戴泽克、劳伦·马赫、小伊萨克·C.辛格尔顿、Giles New、麦肯锡·克鲁克、David Patykewich、达米恩·奥哈尔、盖伊·西纳、戴兰·史密斯、Nej Adamson、凯文·麦克纳利、克里斯</p>
				</div>
				<div class="jj">
					<h2>影片简介</h2>
					<p>故事发生在17世纪,传说中海盗最为活跃的加勒比海。风趣迷人的杰克船长(约翰尼·德普 饰),是活跃在加勒比海上的海盗,拥有属于自己的“黑珍珠号”海盗船。对他来说,最惬意的生活就是驾驶着“黑珍珠号”在加勒比海上游荡,自由自在的打劫过往船只。但不幸的是,他的仇敌,老谋深算的巴罗萨船长(杰弗里·拉什 饰)偷走了他的“黑珍珠号”。巴罗萨是一个无恶不作的坏蛋,他抢劫了杰克的“黑珍珠号”后,更加猖狂,在加勒比海上横行霸道,一时成为整个加勒比海……</p>
				</div>
			</div>
		</div>
		<div class="roll">
			<div class="roll-box">
				<div class="roll-1">
					<img src="img/z-1.jpg" alt="">
					<img src="img/z-2.jpg" alt="">
					<img src="img/z-3.jpg" alt="">
					<img src="img/z-4.jpg" alt="">
					<img src="img/z-5.jpg" alt="">
					<img src="img/z-6.jpg" alt="">
					<img src="img/z-7.jpg" alt="">
					<img src="img/z-8.jpg" alt="">
					<img src="img/z-9.jpg" alt="">
				</div>
			</div>
		</div>
		<footer>版权归加勒比海盗所有</footer>
	</div>
</body>
</html>

五、源码获取

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

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

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

相关文章

数据结构从入门到精通——树和二叉树

树和二叉树 前言一、树概念及结构1.1树的概念1.2 树的相关概念&#xff08;重要&#xff09;1.3 树的表示1.4 树在实际中的运用&#xff08;表示文件系统的目录树结构&#xff09; 二、二叉树概念及结构2.1二叉树概念2.2现实中的二叉树2.3 特殊的二叉树2.4 二叉树的性质2.5 二叉…

PCB差分通孔的数值建模方法

目录 0 引言 1 基于CST的3D通孔模型 2 通孔模型的近似等效计算 3 利用ADS进行电路仿真分析 4 总结 0 引言 当数据速率超过10Gbps时&#xff0c;PCB上的通孔所带来的寄生参数会成为影响数据误码率的关键因素之一&#xff0c;虽然通过三维电磁场求解器提取过孔的行为模型&…

rust入门(1)创建项目

安装 vscode 安装插件 rust-analyzerNative Debug vscode 配置自动格式化代码 settings.json{"editor.defaultFoldingRangeProvider": null,"[rust]": {"editor.defaultFormatter": "rust-lang.rust-analyzer", // Makes the magi…

Python 井字棋游戏

井字棋是一种在3 * 3格子上进行的连珠游戏&#xff0c;又称井字游戏。井字棋的游戏有两名玩家&#xff0c;其中一个玩家画圈&#xff0c;另一个玩家画叉&#xff0c;轮流在3 * 3格子上画上自己的符号&#xff0c;最先在横向、纵向、或斜线方向连成一条线的人为胜利方。如图1所示…

静态时序分析:SDC约束命令set_output_delay详解

相关阅读 静态时序分析https://blog.csdn.net/weixin_45791458/category_12567571.html?spm1001.2014.3001.5482 目录 指定延迟值 指定端口、引脚列表 指定参考时钟 简单使用 指定时钟下降沿 指定参考端口、引脚 包含源、网络延迟 指定电平敏感 指定上升、下降沿 指…

Redux Toolkit

本文作者为 360 奇舞团前端开发工程师 阅读本文章前&#xff0c;需要先了解下 redux 的基本概念与用法&#xff0c;Redux Toolkit 是建立在 Redux 基础之上的工具包&#xff0c;因此需要对 Redux 的基本概念有一定的了解&#xff0c;包括 Action、Reducer、Store、Middleware 等…

C#四部曲(知识补充)

Unity跨平台原理 .Net相关 只要编写的时候遵循.NET的这些规则&#xff0c;就能在.NET平台下通用 各种源码→根据.NET规范编写→(虚拟机)生成CIL中间码(保存在程序集中)→转成操作系统原代码 跨语言← 跨平台↓ Unity跨平台原理&#xff08;Mono&#xff09; c#脚本→MonoC#编…

低压线性恒流LED恒流驱动芯片SM15633EH:用于洗墙灯和线条灯

洗墙灯和线条灯是两种常见的LED照明产品&#xff0c;它们都需要使用LED恒流驱动芯片来确保稳定、可靠的电流供应&#xff0c;从而保证LED的使用寿命和亮度。 对于洗墙灯而言&#xff0c;由于其发出的光线需要覆盖较大的区域&#xff0c;因此需要使用较大功率的LED芯片&#xf…

Linux操作系统与Windows文件互传(FTP)

一、开启Ubuntu下的FTP服务 打开Ubuntu的终端窗口&#xff0c;然后执行如下命令来安装 FTP服务。 sudo apt-get install vsftpd等待软件安装完成后&#xff0c;用输入以下命令打开vsftpd.conf文件 sudo vim /etc/vsftpd.conf 找到下图的两个使能语句改成如图即可(记住保存后再…

新版哥白尼系统快速下载哨兵数据

在新版哥白尼系统下载数据,总是failed或者速度很慢,如何实现MB/s的下载速度,只需要四步就可以解决: 1 登录系统,找到想下载的数据,点开product info按扭,​​​​​​ 2. 找到数据的Product id和Name, #Product id:https://zipper.dataspace.copernicus.eu/odata/v1/P…

Selenium操作浏览器,弹出文件选择框,实现自动选定“目标文件”

前言 本文是该专栏的第20篇,后面会持续分享python爬虫干货知识,记得关注。 我们在使用selenium操作目标页面的时候,可能会遇到如下图所示的情景。 在用selenium操作并点击页面元素的时候,会弹出一个文件选择框,需要我们选择目标文件,并点击确认按钮,目标文件才能上传成…

Stream-JDK8

Stream概念 代码示例 package com.zz.stream;import java.util.ArrayList; import java.util.Collections; import java.util.List; import java.util.stream.Collectors;/*** 使用Stream流* 找出姓张并且是三个字的名字*/ public class Test {public static void main(Stri…

cesiumlab白模效果一

效果 步骤 1、准备shp面数据 2、打开cesiumlab软件转换 选择shp面数据 设置高度&#xff0c;如果shp面中有高度字段&#xff0c;可以用高度字段&#xff0c;如果没有&#xff0c;可以用固定高度 设置贴图&#xff0c;这边用的是第二张效果&#xff0c;当然也可以用自己的贴图…

‘UnityEngine.Application‘ does not contain a definition for isBatchMode

unity 2017.4.37f1. 解决办法: Try to replace Application.isBatchMode with UnityEditorInternal.InternalEditorUtility.inBatchMode

MySQL实战:问题排查与监控

常见问题 有更合适的索引不走&#xff0c;怎么办&#xff1f; MySQL在选取索引时&#xff0c;会参考索引的基数&#xff0c;基数是MySQL估算的&#xff0c;反映这个字段有多少种取值&#xff0c;估算的策略为选取几个页算出取值的平均值&#xff0c;再乘以页数&#xff0c;即…

AI新工具(20240312) Midjourney官方发布角色一致性功能;免费且开源的简历制作工具;精确克隆语调、控制声音风格

1: Midjourney角色一致性功能 使人物画像在多方面高度一致成为可能。 Midjourney的角色一致性功能的使用方法如下&#xff1a; ⭐在你的输入指令后面加上 --cref URL&#xff0c;其中URL是你选择的角色图像的链接。 ⭐你可以通过 --cw 参数来调整参照的强度&#xff0c;范围…

Selenium控制已运行的Edge和Chrome浏览器(详细启动步骤和bug记录)

文章目录 前期准备1. 浏览器开启远程控制指令&#xff08;1&#xff09;Edge&#xff08;2&#xff09;Chrome 2. 执行python代码&#xff08;1&#xff09;先启动浏览器后执行代码&#xff08;2&#xff09;通过代码启动浏览器 3. 爬取效果3. 完整代码共享3.1 包含Excel部分的…

旅游景区公共广播 园区广播 公路服务区广播

旅游景区公共广播 园区广播 公路服务区广播 旅游景区公共广播 旅游景区公共广播(又称背景音乐)简称BGM&#xff0c;它的主要作用是掩盖噪声并创造一种轻松和谐的气氛&#xff0c;是一种创造轻松愉快环境气氛的音乐。掩盖环境噪声&#xff0c;创造与旅游景区相适应的气氛&#…

ubuntu20.04上获取Livox Avia雷达点云数据

若拿到手的Livox Avia激光雷达不知道它的ip信息&#xff0c;可以在官网上LiDAR Sensors - Livox下载上位机软件Livox Viewer&#xff0c;查看IP&#xff0c;下载window版本就可以。雷达通过网线连上电脑后&#xff0c;该软件就可以自动识别出来。按照下图步骤&#xff0c;就可以…

自动化运维工具---------------ANSIBLE

一、Ansible 发展史及功能 作者&#xff1a;Michael DeHaan&#xff08; Cobbler pxe kikstar 与 Func 作者&#xff09;ansible 的名称来自科幻小说《安德的游戏》中跨越时空的即时通信工具&#xff0c;使用它可以在相距数光年的距离&#xff0c;远程实时控制前线的舰队战斗2…