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

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

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

相关文章

2024年短视频矩阵系统源头技术开发商 --- 就315会议主题结束后分析

前言&#xff1a;&#xff08;禁止抄袭复用本编技术分享&#xff09; 短视频矩阵315提出的ip开发你的技术团队是不是还在进行&#xff1f; 2024年短视频矩阵系统源头技术开发商 --- 就315会议主题结束后分析&#xff0c;昨天的315主题会议不知道大家都看了吗&#xff0c;接…

STC89C52单片机 启动!!!(三)

矩阵键盘介绍 当键盘中按键数量较多时&#xff0c;为了减少I/O口的占用&#xff0c;通常将按键排列成矩阵形式。在矩阵式键盘中&#xff0c;每条水平线和垂直线在交叉处不直接连通&#xff0c;而是通过一个按键加以连接。采用逐行或逐列的“扫描”&#xff0c;就可以读出任何位…

厉害了,2024最新听全网音乐神器

今天分享个神器app简助手&#xff0c;听全网音乐和看片&#xff0c;下载地址 夸克网盘分享 玩转互联网达人 苏生不惑备用号&#xff0c;分享各种黑科技软件资源和技巧&#xff0c;带你玩转互联网。 17篇原创内容 公众号 最新版本更新日志。 进入音乐搜索&#xff1a; 听周杰…

day09-Mybatis

一、Mybatis 基础操作 1 需求 功能列表&#xff1a; 查询 根据主键ID查询 条件查询新增更新删除 根据主键ID删除 根据主键ID批量删除 2 准备 实施前的准备工作&#xff1a; 准备数据库表创建一个新的 springboot 工程&#xff0c;选择引入对应的起步依赖&#xff08;mybatis、…

Vue3-03_组件基础_上

单页面应用程序 什么是单页面应用程序 单页面应用程序&#xff08;英文名&#xff1a;Single Page Application&#xff09;简称 SPA&#xff0c;顾 名思义&#xff0c;指的是一个 Web 网站中只有唯一的一个 HTML 页面&#xff0c;所有的 功能与交互都在这唯一的一个页面内完…

Java八股文(Element Plus)

Java八股文のElement Plus Element Plus Element Plus 什么是Element UI 和 Element Plus&#xff1f; Element UI 和 Element Plus 是基于 Vue.js 的一套非常受欢迎的开源 UI 组件库&#xff0c;用于快速构建具有现代化设计和丰富交互效果的前端界面。 Element UI 和 Element…

固态存储是未来|浅析SSD架构的演进与创新技术-2

除了性能和容量这两个最大的诉求外&#xff0c;其他的需求已经成为SSD现场架构的核心竞争力。 一是安全性&#xff1a;随着数据安全威胁日益严重&#xff0c;SSD的安全设计成为关键&#xff0c;包括提供单芯片硬件信任根、遵循FIPS140-3安全标准以及支持一次性可编程位字段来锁…

uni app 钓鱼小游戏

最近姑娘喜欢玩那个餐厅游戏里的钓鱼 &#xff0c;经常让看广告&#xff0c;然后就点点点... 自己写个吧。小鱼的图片自己搞。 有问题自己改&#xff0c;不要私信我 <template><view class"page_main"><view class"top_linear"><v…

react-native使用FireBase实现google登陆

一、前置操作 首先下载这个包 yarn add react-native-google-signin/google-signin 二、Google cloud配置 Google Cloud 去google控制台新建一个android项目&#xff0c;这时候需要用到你自己创建的keystore的sha1值&#xff0c;然后会让你下载一个JSON文件&#xff0c;先保…

C#操作MySQL从入门到精通(4)——连接MySQL数据库

前言 我们创建好数据库、建立好数据库的表以后&#xff0c;我们就需要访问数据库了&#xff0c;比如将数据插入数据库的某张表中等一系列操作&#xff0c;在进行这些操作之前我们需要连接上数据库&#xff0c;本文就是详细讲解如何连接MySQL数据库的。 1、使用Navicat Premiu…

基于ssm+layui的图书管理系统

基于ssmlayui的图书管理系统 账户类型分为&#xff1a;管理员&#xff0c;用户管理员私有功能用户私有功能公共功能技术栈功能实现图 视频演示 账户类型分为&#xff1a;管理员&#xff0c;用户 图书管理系统主要登录账户类型为管理员账户与用户账户 管理员私有功能 账户管理…

PHP 生成图片

1.先确认是否有GD库 echo phpinfo(); // 创建一个真彩色图像 $image imagecreatetruecolor(120, 50);// 分配颜色 $bgColor imagecolorallocate($image, 255, 255, 255); // 白色背景 $textColor imagecolorallocate($image, 230, 230, 230); // 黑色文字// 填充背景 image…

Java学习笔记(12)

包 导包 Final 不能被改变的&#xff0c;修饰方法 类 变量 方法不能被重写 类不能被继承 变量&#xff0c;赋值一次&#xff0c;变成常量&#xff0c;不能再被赋值 final修饰引用数据类型&#xff0c;地址值不能变&#xff0c;里面的内容可以变 字符串是不可变的 源码中使…

ThreeJs 可视化大屏地图

效果图&#xff1a; 今天给各位提供一个可视化地图的案例和源码&#xff0c;关注下吧各位&#xff01;回复"大屏地图" 获取工程 1、案例分析&#xff1a;主要使用了UI 美工图片&#xff0c;然后获取地图的json 数据绘制图形&#xff0c;贴图使用该区域的地图纹理进行…

基于SpringBoot和Vue的宠物商城网站

目录 一、 绪论1.1 研究背景1.2 研究目的1.3 研究意义 二、相关技术2.1 Spring Boot简介2.2 Vue简介2.3 前后端分离架构概述2.4 其他技术和工具 三、需求分析3.1 功能需求3.1.1 用户模块功能需求3.1.2 商品模块功能需求3.1.3 论坛模块功能需求3.1.4 留言板模块功能需求 3.2 用户…

异常机制总结

异常的本质_调试错误 异常是什么&#xff1f; 软件程序在运行过程中&#xff0c;非常可能遇到刚刚提到的这些问题&#xff0c;我们称之为异常&#xff0c;英文是&#xff1a;Exception&#xff0c;意思是例外。遇到这些例外情况&#xff0c;或者叫异常。 伪代码说明异常机制…

会员项目定价卡css3特效

会员项目定价卡css3特效&#xff0c;源码由HTMLCSSJS组成&#xff0c;记事本打开源码文件可以进行内容文字之类的修改&#xff0c;双击html文件可以本地运行效果&#xff0c;也可以上传到服务器里面 下载地址 会员项目定价卡css3特效代码

谁将是RAG的头部玩家?

开篇 菩提修妙树&#xff0c;接引证法源&#xff0c;屠龙万仙阵&#xff0c;玉虚祭封神。 混战是国内技术圈的常态&#xff0c;在众仙跟风与追捧的大潮中&#xff0c;如何看清方向至关重要&#xff0c;决定谁最终将封神。 语言大模型(LLM)&#xff0c;多模态(MM)&#xff0c;…

代码随想录day22(1)二叉树:左叶子之和(leetcode404)

题目要求&#xff1a;计算二叉树所有左叶子之和 思路&#xff1a;本题应该满足两个条件&#xff0c;一是叶子节点&#xff0c;二是要求是左叶子。所以判断时&#xff0c;如果一个节点左孩子的左右孩子均为空&#xff0c;且其右孩子也为空&#xff0c;此节点的左孩子就为左叶子…

编程语言常识

看图区别编程语言 什么是强类型、弱类型语言&#xff1f;哪种更好&#xff1f; 强类型语言 强类型语言是一种强制类型定义的语言&#xff0c;即一旦某一个变量被定义类型&#xff0c;如果不经强制转换&#xff0c;那么它永远就是该数据类型。 在强类型语言中&#xff0c;变量的…