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

news2024/11/18 18:32:19

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

文章目录

  • 一、作品介绍
  • 二、作品演示
  • 三、代码目录
  • 四、网站代码
    • 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年,利物浦首次晋级英格兰足总杯决赛,但是最终却以01败给了伯恩利。球队在1921/22赛季、1922/23赛季连续两次获得了联赛冠军,但在此之后利物浦再也没有获得过任何冠军。直到1946/47赛季获得球队的第五座联赛冠军。1950年,球队再次晋级足总杯决赛,但是最后输给了阿森纳。
            </p>
            <p>1953/54赛季,利物浦球队降级到了乙级联赛。 在降级后的这段时期内,利物浦遭遇到了球队历史上的最大耻辱,在1958/59赛季足总杯的一场比赛中利物浦以12不敌非职业球队伍斯特城队。
            </p>
        </div>
    </div>
</body>

</html>

五、源码获取

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

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

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

相关文章

【webrtc】内置opus解码器的移植

m98 ,不知道是什么版本的opus,之前的交叉编译构建: 【mia】ffmpeg + opus 交叉编译 【mia】ubuntu22.04 : mingw:编译ffmpeg支持opus编解码 看起来是opus是1.3.1 只需要移植libopus和opus的webrtc解码部分即可。 linux构建的windows可运行的opus库 G:\NDDEV\aliply-0.4\C…

0407放大电路的频率响应

放大电路的频率响应 单时间常数RC电路的频率响应中频响应高频响应低频响应全频域响应 放大电路频率响应概述1. 直接耦合放大电路频域响应阻容耦合放大电路频域响应 4.7.1 单时间常数RC电路的频率响应 4.7.2 放大电路频率响应概述 4.7.3 单级共射极放大电路的频率响应 4.7.4 单级…

51单片机-数码管显示多个

书接上回 51单片机-数码管显示单个 http://t.csdnimg.cn/Ii6x0 一.简单全亮 ps:有好几次没电亮,是没加阻值,看了这方面的基础要好好补补了. 这种是不需要控制哪个亮,全部接了电.直接用上一篇的代码,就可以每个都动态变化 #include <reg52.h> #include <intrins.h…

aws eks集成wasm运行时并启动pod

参考资料 WebAssembly 在云原生中的实践指南&#xff0c;https://cloud.tencent.com/developer/article/2324065 作为一种通用字节码技术&#xff0c;wasm的初衷是在浏览器中的程序实现原生应用性能。高级语言将wasm作为目标语言进行编译并运行在wasm解释器中。和nodejs类似的…

Unity Render Streaming 云渲染 外网访问

初版&#xff1a; 日期&#xff1a;2024.5.20 前言&#xff1a;临时思路整理&#xff0c;后期会详细补充 环境&#xff1a; 1. 阿里云服务器 需要安装好nodejs 、npm 2. windows电脑&#xff0c;需安装好 nodejs 、npm 3.Unity 2021.3.15f1 4.Unity Render Streaming …

景源畅信电商:抖店怎么提高店铺的权重?

在竞争激烈的电商市场&#xff0c;如何提升抖店店铺权重成为商家关注的焦点。店铺权重是决定商品搜索排名的关键因素之一&#xff0c;直接关系到店铺流量和销量。提高店铺权重并非一蹴而就&#xff0c;而是一个系统工程&#xff0c;需要从多个维度着手优化。 一、优化商品标题和…

Dubbo生态之dubbo功能

1.Dubbo生态功能的思考 dubbo具有哪些功能呢&#xff1f;我们要根据dubbo的架构和本质是用来干什么的来思考? 首先对于分布式微服务&#xff0c;假设我们有两个服务A和B&#xff0c;并且都是集群部署的。那么按照我们正常的流程应该是启动两个微服务项目&#xff08;启动时应该…

大模型落地竞逐,云计算大厂“百舸争流”

作者 | 辰纹 来源 | 洞见新研社 从ChatGPT到Sora&#xff0c;从图文到视频&#xff0c;从通用大模型到垂直大模型……经过了1年多时间的探索&#xff0c;大模型进入到以落地为先的第二阶段。 行业的躁动与资本的狂热相交汇&#xff0c;既造就了信仰派的脚踏实地&#xff0c;也…

二十五篇:嵌入式系统揭秘:基础理论与实践探索

嵌入式系统揭秘&#xff1a;基础理论与实践探索 1. 嵌入式系统的定义与特性 1.1 详细解释 嵌入式系统&#xff0c;作为一种特殊的计算机系统&#xff0c;其设计目的是为了执行一个或多个特定的功能。与通用计算机相比&#xff0c;嵌入式系统通常被集成到更大的设备中&#xf…

web压力测试,要不要过滤掉JS,CSS等请求?

在进行性能测试&#xff08;压测&#xff09;时&#xff0c;是否过滤掉对JavaScript、CSS等静态资源的请求&#xff0c;取决于你测试的目标和目的。 是测试服务端的性能还是前端的性能。这两种目的所涉及到的测试场景和工具等方法是不一样的。 一般的web产品&#xff0c;像cs…

dify:开源 LLMOps平台。

单纯笔记&#xff1a; 一、关于 Dify dify/README_CN.md at main langgenius/dify GitHub Dify 是一款开源的大语言模型&#xff08;LLM&#xff09;应用开发平台。它融合了后端即服务&#xff08;Backend as Service&#xff09;和 LLMOps 的理念&#xff0c;使开发者可以…

vite+ts+mock+vue-router+pinia实现vue的路由权限

0.权限管理 前端的权限管理主要分为如下&#xff1a; 接口权限路由权限菜单权限按钮权限 权限是对特定资源的访问许可&#xff0c;所谓权限控制&#xff0c;也就是确保用户只能访问到被分配的资源 1.项目搭建 创建vite项目 yarn create vite配置别名 npm install path -…

不用从头训练,通过知识融合创建强大的统一模型

在自然语言处理&#xff08;NLP&#xff09;领域&#xff0c;大型语言模型&#xff08;LLMs&#xff09;的开发和训练是一个复杂且成本高昂的过程。数据需求是一个主要问题&#xff0c;因为训练这些模型需要大量的标注数据来保证其准确性和泛化能力&#xff1b;计算资源也是一个…

关于基础的流量分析(1)

1.对于流量分析基本认识 1&#xff09;简介&#xff1a;网络流量分析是指捕捉网络中流动的数据包&#xff0c;并通过查看包内部数据以及进行相关的协议、流量分析、统计等来发现网络运行过程中出现的问题。 2&#xff09;在我们平时的考核和CTF比赛中&#xff0c;基本每次都有…

【Linux取经路】进程通信——共享内存

文章目录 一、直接原理1.1 共享内存的的申请1.2 共享内存的释放 二、代码演示2.1 shmget2.1.1 详谈key——ftok 2.2 创建共享内存样例代码2.3 获取共享内存——进一步封装2.4 共享内存挂接——shmat2.5 共享内存去关联——shmdt2.6 释放共享内存——shmctl2.7 开始通信2.7.1 pr…

安全攻防基础

一、安全是什么&#xff1f;就是三个基础原则 安全就是保护数据 1. 机密性 对未授权的主体不可见 开发人员不能拥有敏感数据的访问权限 密钥要复杂 显示器伤的数据被别有用心的人窥探 2. 完整性 没授权的人不可修改数据 3. 可用性 被授权的主体可读 二、如何解决安全问题…

Rust面试宝典第14题:旋转数组

题目 给定一个数组&#xff0c;将数组中的元素向右移动k个位置&#xff0c;其中k是非负数。要求如下&#xff1a; &#xff08;1&#xff09;尽可能想出更多的解决方案&#xff0c;至少有三种不同的方法可以解决这个问题。 &#xff08;2&#xff09;使用时间复杂度为O(n)和空间…

微服务远程调用 RestTemplate

Spring给我们提供了一个RestTemplate的API&#xff0c;可以方便的实现Http请求的发送。 同步客户端执行HTTP请求&#xff0c;在底层HTTP客户端库(如JDK HttpURLConnection、Apache HttpComponents等)上公开一个简单的模板方法API。RestTemplate通过HTTP方法为常见场景提供了模…

VisualStudio2022的使用

Visual Studio 2022 的安装、卸载和使用方法详解 一、安装Visual Studio 2022 1. 下载Visual Studio 2022 要安装Visual Studio 2022&#xff0c;需要先下载安装程序。可以从微软的官方网站&#xff08;Visual Studio下载页面&#xff09;下载免费的社区版&#xff08;Commun…

非平稳信号的傅里叶变换与短时傅里叶变换

一、仿真一个非平稳的时间序列。 N 10000; t 0:N-1; z1 4.2*sin(2*pi/20.*t5); z2 2.2*sin(2*pi/100.*(10.001*t).*t8); w1 randn(length(t),1); yz1z2w1; figure;plot(y,LineWidth,1.5);grid on; ylabel(Signal); xlabel(Time); 二、傅里叶变换&#xff08;FFT&#xff…