当前位置： 首页 > news >正文

HTML静态网页成品作业(HTML+CSS)——利物浦足球俱乐部介绍网页设计制作(5个页面)

news 2026/2/9 14:54:44

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

文章目录

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

一、作品介绍

🏷️本套采用HTML+CSS，共有5个页面。

二、作品演示

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

三、代码目录

在这里插入图片描述

四、网站代码

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><!-- logo --><div class="logo w"><img src="./images/logo.jpg" alt=""></div><!-- 导航 --><div class="nav w"><ul><li><a href="./lineup.html">球队阵容</a></li><li><a href="./manage.html">管理团队</a></li><li><a href="./jersey.html">球队队服</a></li><li><a href="./homefield.html">球队主场</a></li></ul></div><!-- 展示图片 --><div class="show w"><img src="./images/show.jpeg" alt=""></div><!-- 内容 --><div class="content w"><h2>球队历史</h2><div class="history"><p>利物浦足球俱乐部（Liverpool F.C.，简称“利物浦”）是一家位于英格兰西北部默西赛德郡港口城市利物浦的足球俱乐部，成立于1892年，是英格兰足球超级联赛的球队之一。</p><p>利物浦是英格兰足球历史上最成功的俱乐部之一，也是欧洲乃至世界最成功的足球俱乐部之一。 [1]  利物浦一共夺取过19次英格兰顶级联赛冠军、8次英格兰足总杯冠军、9次英格兰联赛杯冠军、16次英格兰社区盾杯冠军、6次欧洲冠军联赛（含欧洲冠军俱乐部杯）冠军、3次欧洲足联欧洲联赛（含欧洲联盟杯）冠军、4次欧洲超级杯冠军以及1次国际足联俱乐部世界杯冠军。</p><p>利物浦足球俱乐部成立于1892年，由约翰·霍丁创立。俱乐部的成立是在安菲尔德球场的拥有者约翰·霍丁与埃弗顿足球俱乐部之间发生了一次涉及多方面原因的争执之后。1884-1892年间，埃弗顿俱乐部的成立以及比赛一直都在安菲尔德球场。之后约翰·霍丁与生意伙伴奥利尔先生为球队建起了一座新的球场。如何管理俱乐部和经营生意的冲突变得不可调和。霍丁在个人经济利益的驱使下，决定将安菲尔德球场的租金从100英镑涨到250英镑。在安菲尔德踢了8年球的埃弗顿队不得不离开了霍丁和安菲尔德球场，而搬到了新球场古迪逊公园球场。</p><p>霍丁在空出的的安菲尔德球场上建立了利物浦足球俱乐部。俱乐部最初的名字是埃弗顿足球俱乐部与体育场地股票上市公司简称为Everton Athletic，但是由于足球协会有其他球队叫做埃弗顿，所以该俱乐部更名为利物浦。</p><p>利物浦成员在兰开夏郡联赛(Lancashire League)的第一个赛季中他们就赢得了冠军，并在随后的第二个赛季成功升到乙级(第二级)联赛。他们获得了乙级联赛的冠军，并且成功升入了甲级(第一级)联赛。</p><p>在1900/01赛季，利物浦球队获得了第一个顶级联赛冠军头衔，并且在1905/06赛季再次夺冠。 在1914年，利物浦首次晋级英格兰足总杯决赛，但是最终却以0比1败给了伯恩利。球队在1921/22赛季、1922/23赛季连续两次获得了联赛冠军，但在此之后利物浦再也没有获得过任何冠军。直到1946/47赛季获得球队的第五座联赛冠军。1950年，球队再次晋级足总杯决赛，但是最后输给了阿森纳。</p><p>在1953/54赛季，利物浦球队降级到了乙级联赛。 在降级后的这段时期内，利物浦遭遇到了球队历史上的最大耻辱，在1958/59赛季足总杯的一场比赛中利物浦以1比2不敌非职业球队伍斯特城队。</p></div></div>
</body></html>

五、源码获取

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

相关文章：

HTML静态网页成品作业(HTML+CSS)——利物浦足球俱乐部介绍网页设计制作(5个页面)

&#x1f389;不定期分享源码&#xff0c;关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 &#x1f3f7;️本套采用HTMLCSS&#xff0c;共有5个页面。 二、作品演示 三、代码目录 四、网站代码 HTML部分代…...

编程日记 2024/5/24 7:46:48

mac 查看占用80端口的命令

在 Mac 上&#xff0c;如果你想查看哪个进程正在使用 80 端口&#xff0c;你可以使用 lsof 命令。这个命令非常强大&#xff0c;用于列出被进程打开或使用的文件信息。 打开你的终端&#xff0c;并输入以下命令&#xff1a; sudo lsof -i :80这里&#xff0c;-i :80 选项告诉…...

编程日记 2024/5/24 7:45:47

【Qt常用控件】—— 布局管理器

目录 前言 &#xff08;一&#xff09;垂直布局 &#xff08;二&#xff09;水平布局 &#xff08;三&#xff09;网格布局 &#xff08;四&#xff09;表单布局 &#xff08;五&#xff09;分组布局 &#xff08;六&#xff09;Spacer 总结 前言 之前使⽤Qt在界⾯上…...

编程日记 2024/5/24 7:44:46

模板中的右值引用（万能引用）、引用折叠与完美转发

模板中的右值引用&#xff08;万能引用&#xff09;、引用折叠与完美转发 文章目录 模板中的右值引用&#xff08;万能引用&#xff09;、引用折叠与完美转发一、万能引用与引用折叠1. 模板中的右值引用2. 自动类型推导(auto)与万能引用3. 引用折叠与万能引用4. lambda表达式捕…...

编程日记 2024/5/24 7:43:45

Nacos启动报错：[db-load-error]load jdbc.properties error

在学习Nacos中间件时&#xff0c;出现了一个错误&#xff0c;竟然启动报错&#xff01;&#xff01;&#xff01;! 这个错误第一次遇见&#xff0c;当时我感觉大体就是--数据库连接方面的错误。 可是&#xff0c;对于初学者的我来说一脸懵啊&#xff1f;&#xff1f;&#xff…...

编程日记 2024/5/24 7:42:43

5.23相关性分析

相关性分析是一件很自然而然的事情&#xff0c;在生活中和科学研究中&#xff0c;我们都可能会不由自主地关注两件或者多件事情之间的联系。比如性别和方向感有没有关系&#xff0c;有多大关系&#xff0c;辨别不同事物时如何说明特征的科学性&#xff08;也就是该特征和事物的…...

编程日记 2024/5/24 7:41:42

使用 Sonatype Nexus Repository Manager 如何安装npm.md

1. 安装与启动 Nexus2. 登录 Nexus Web UI3. 创建 npm 仓库4. &#xff08;可选&#xff09;配置 npm 代理仓库5. 创建 npm 仓库组6. 配置 npm 客户端7. 测试和使用 Sonatype Nexus Repository Manager (通常简称 Nexus) 是一个强大的二进制管理系统&#xff0c;用于存储和管理…...

编程日记 2024/5/24 7:40:40

console如何连接远程机器上的java程序

启动参数 -Djava.rmi.server.hostname192.168.1.10 -Dcom.sun.management.jmxremote -Dcom.sun.management.jmxremote.port12345 -Dcom.sun.management.jmxremote.sslfalse -Dcom.sun.management.jmxremote.authenticatefalse2.jdk安装目录/bin下执行 go jconsole![在这里插入…...

编程日记 2024/5/24 7:39:39

高稳定数显芯片防干扰抗噪数码屏驱动高亮LED驱动IC-VK16K33A/AA 最大13×3的按键扫描

产品型号&#xff1a;VK16K33A/AA 产品品牌&#xff1a;永嘉微电/VINKA 封装形式&#xff1a;SOP28/SSOP28 原厂&#xff0c;工程服务&#xff0c;技术支持&#xff01; 概述 VK16K33A/AA是一种带按键扫描接口的数码管或点阵LED驱动控制专用芯片&#xff0c;内部集成有数据…...

编程日记 2024/5/24 7:38:38

Redis离线安装(单机)

目录 1-环境准备1-1下载redis-4.0.11.tar.gz1-2gcc环境 2-上传解压3-编译安装(需要gcc环境)4-配置redis5-启动Redis6-开启防火墙(root)7-添加开机启动脚本8-设置权限9-设置开机启动10-测试redis服务11-检查是否安装成功12-创建redis命令软连接13-测试redis14-必要时设置防火墙 …...

编程日记 2024/5/24 7:37:37

[Algorithm][动态规划][路径问题][不同路径][不同路径Ⅱ][珠宝的最高价值]详细讲解

目录 1.不同路径1.题目链接2.算法原理详解3.代码实现 2.不同路径 II1.题目链接2.算法原理详解3.代码实现 3.珠宝的最高价值1.题目链接2.算法原理详解3.代码实现 1.不同路径 1.题目链接 不同路径 2.算法原理详解 思路&#xff1a; 确定状态表示 -> dp[i][j]的含义 走到dp[…...

编程日记 2024/5/24 7:36:36

ChatGPT移动应用收入在GPT-4o发布后迎来最大涨幅

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗&#xff1f;订阅我们的简报&#xff0c;深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同&#xff0c;从行业内部的深度分析和实用指南中受益。不要错过这个机会&#xff0c;成为AI领…...

编程日记 2024/5/24 7:35:35

汉语拼音 如何 转化成粤语拼音 的

将汉语拼音&#xff08;普通话拼音&#xff09;转化为粤语拼音涉及到对声母、韵母以及声调的对照和调整。以下是详细的转换步骤和注意事项&#xff1a; 一、转换步骤 识别普通话拼音的声母和韵母查找对应的粤语拼音声母和韵母应用粤语声调 二、声母对照表 普通话拼音粤语拼…...

编程日记 2024/5/24 7:34:34

本地电子邮件测试工具-MailHog

通过MailHog&#xff0c;可以在浏览器中查看本机发的邮件内容&#xff0c;而无需发送到外网。 https://github.com/mailhog/MailHog在 macOS 环境下&#xff0c;下载文件后: 添加可执行权限:chmod x MailHog_darwin_amd64 运行:./MailHog_darwin_amd64 浏览器打开查看邮件:htt…...

编程日记 2024/5/24 7:32:32

Java18新特性

Java 18引入了若干新特性&#xff0c;以增强语言的功能性和性能。具体如下&#xff1a; 服务提供者接口&#xff08;Service Provider Interfaces, SPI&#xff09;&#xff1a;允许开发者为Java模块系统定义服务加载机制&#xff0c;从而能够更灵活地发现和加载服务实现。简单…...

编程日记 2024/5/24 7:31:31

大象资讯：PostgreSQL 17 Beta 1 发布！

↑ 关注“少安事务所”公众号&#xff0c;欢迎⭐收藏&#xff0c;不错过精彩内容~ PostgreSQL 全球开发小组 发布于 2024-05-23 PostgreSQL 全球开发小组宣布&#xff0c;PostgreSQL 17 的第一个测试版本现已可供下载。此版本包含 PostgreSQL 17 正式发布时将提供的所有功能的预…...

编程日记 2024/5/24 7:28:28

Rust：如何在 Windows 的 Linux 子系统（WSL）下安装

一、安装步骤 在Windows Subsystem for Linux (WSL)下安装Rust&#xff0c;可以按照以下步骤进行&#xff1a; 打开WSL终端&#xff1a; 首先&#xff0c;确保你的WSL已经安装并正常运行。你可以在Windows搜索栏中输入“WSL”并选择你安装的Linux发行版&#xff08;如Ubuntu&a…...

编程日记 2024/5/24 7:27:27

工具分享：VsCode注释神器，koro1FileHeader

他是有官方Wiki的。 https://github.com/OBKoro1/koro1FileHeader/wiki/ 项目在GitHub上开源。以下摘录部分wiki&#xff0c;用作介绍分享在这里插入代码片 如何找到setting.json设置模板 简单的输入命令 打开VSCode命令面板: mac: command p window: ctrl p输入> Ope…...

编程日记 2024/5/24 7:26:25

水面漂浮物生活垃圾识别检测系统

水面漂浮物生活垃圾识别检测系统通过现场监控摄像机对河道湖面等水体进行实时监测&#xff0c;水面漂浮物生活垃圾识别检测系统借助智能视频分析技术和YOLO深度学习技术&#xff0c;系统能够自动识别和抓拍水面上的垃圾漂浮物。一旦系统检测到有垃圾漂浮在水面上&#xff0c;立…...

编程日记 2024/5/24 7:25:24

通过python读取并发送二进制文件到串口

代码 #!python.exe """ filename send_bin.py brief According to the users input, read bin file, subpackage and send the file by UART. HowToUse send_bin.py -h author shadowThreeDgmail.com data 20220224 &q…...

编程日记 2024/5/24 7:24:23

eNSP-Cloud(实现本地电脑与eNSP内设备之间通信)

说明&#xff1a; 想象一下&#xff0c;你正在用eNSP搭建一个虚拟的网络世界&#xff0c;里面有虚拟的路由器、交换机、电脑&#xff08;PC&#xff09;等等。这些设备都在你的电脑里面“运行”&#xff0c;它们之间可以互相通信&#xff0c;就像一个封闭的小王国。 但是&#…...

编程新知 2026/2/8 4:37:17

＜6＞-MySQL表的增删查改

目录 一&#xff0c;create&#xff08;创建表&#xff09; 二&#xff0c;retrieve&#xff08;查询表&#xff09; 1&#xff0c;select列 2&#xff0c;where条件 三&#xff0c;update&#xff08;更新表&#xff09; 四&#xff0c;delete&#xff08;删除表&#xf…...

编程新知 2025/12/11 18:28:17

ubuntu搭建nfs服务centos挂载访问

在Ubuntu上设置NFS服务器 在Ubuntu上&#xff0c;你可以使用apt包管理器来安装NFS服务器。打开终端并运行&#xff1a; sudo apt update sudo apt install nfs-kernel-server创建共享目录 创建一个目录用于共享&#xff0c;例如/shared&#xff1a; sudo mkdir /shared sud…...

编程新知 2026/2/6 23:18:59

【入坑系列】TiDB 强制索引在不同库下不生效问题

文章目录 背景SQL 优化情况线上SQL运行情况分析怀疑1：执行计划绑定问题？尝试：SHOW WARNINGS 查看警告探索 TiDB 的 USE_INDEX 写法Hint 不生效问题排查解决参考背景 项目中使用 TiDB 数据库，并对 SQL 进行优化了，添加了强制索引。 UAT 环境已经生效，但 PROD 环境强制索…...

编程新知 2026/1/31 21:56:58

BCS 2025｜百度副总裁陈洋：智能体在安全领域的应用实践

6月5日&#xff0c;2025全球数字经济大会数字安全主论坛暨北京网络安全大会在国家会议中心隆重开幕。百度副总裁陈洋受邀出席&#xff0c;并作《智能体在安全领域的应用实践》主题演讲&#xff0c;分享了在智能体在安全领域的突破性实践。他指出&#xff0c;百度通过将安全能力…...

编程新知 2026/2/1 11:33:19

鱼香ros docker配置镜像报错：https://registry-1.docker.io/v2/

使用鱼香ros一件安装docker时的https://registry-1.docker.io/v2/问题 一键安装指令 wget http://fishros.com/install -O fishros && . fishros出现问题&#xff1a;docker pull 失败 网络不同&#xff0c;需要使用镜像源 按照如下步骤操作 sudo vi /etc/docker/dae…...

编程新知 2025/12/31 6:28:08

【LeetCode】3309. 连接二进制表示可形成的最大数值（递归|回溯|位运算）

LeetCode 3309. 连接二进制表示可形成的最大数值&#xff08;中等&#xff09; 题目描述解题思路Java代码 题目描述 题目链接&#xff1a;LeetCode 3309. 连接二进制表示可形成的最大数值&#xff08;中等&#xff09; 给你一个长度为 3 的整数数组 nums。 现以某种顺序 连接…...

编程新知 2025/7/5 18:01:05

沙箱虚拟化技术虚拟机容器之间的关系详解

问题 沙箱、虚拟化、容器三者分开一一介绍的话我知道他们各自都是什么东西&#xff0c;但是如果把三者放在一起&#xff0c;它们之间到底什么关系&#xff1f;又有什么联系呢&#xff1f;我不是很明白&#xff01;&#xff01;&#xff01; 就比如说&#xff1a; 沙箱&#…...

编程新知 2026/2/6 6:05:52

C++实现分布式网络通信框架RPC(2)——rpc发布端

有了上篇文章的项目的基本知识的了解&#xff0c;现在我们就开始构建项目。 目录 一、构建工程目录 二、本地服务发布成RPC服务 2.1理解RPC发布 2.2实现 三、Mprpc框架的基础类设计 3.1框架的初始化类 MprpcApplication 代码实现 3.2读取配置文件类 MprpcConfig 代码实现…...

编程新知 2026/2/5 18:18:58

解析“道作为序位生成器”的核心原理

解析“道作为序位生成器”的核心原理 以下完整展开道函数的零点调控机制&#xff0c;重点解析"道作为序位生成器"的核心原理与实现框架&#xff1a; 一、道函数的零点调控机制 1. 道作为序位生成器 道在认知坐标系$(x_{\text{物}}, y_{\text{意}}, z_{\text{文}}…...

编程新知 2026/2/9 11:41:07