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

HTML静态网页成品作业(HTML+CSS)——世博园介绍(2个页面)

news 2026/2/8 7:16:46

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

文章目录

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

一、作品介绍

🏷️本套采用HTML+CSS，未使用Javacsript代码，共有2个页面。

二、作品演示

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

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码


<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>世博园</title><link rel="stylesheet" type="text/css" href="./css/style.css"></head>
<body><div class="main"><div class="header"><div class="header_logo"><img src="./images/logo.png"></div><ul><li><a href="index.html">景区简介</a></li><li><a href="jieshao.html">各馆介绍</a></li></ul></div><div class="banner"><img src="./images/004.jpeg"></div><div class="content"><h1>景区简介</h1><p>上海世博园是2010年上海世博会的举办场地。2010年上海世博会是首次由中国举办，是世界博览会史上最大规模。总投资超过北京奥运会，占地5.28平方公里，参加国家和组织246个，参观人数7308万人，举办活动22900场。园区坐落于美丽的黄浦江畔，卢浦大桥和南浦大桥之间的滨水地区，连接浦西和浦东，极其巧妙地扣住了`城市，让生活更美好`这个世博主题</p><div class="content_img"><img src="./images/001.png"></div><h1>景点分布</h1><p>世博园坐落于南浦大桥和卢浦大桥之间，沿上海城区黄浦江两岸布局。园区占地5.4平方公里，建有5大场馆群，分别为独立馆群、联合馆群、企业馆群、主题馆群和中国馆群。按区域世博园区分为A、B、C、D、E五个功能片区，其中A、B、C三个功能片区分布在浦东地区，D、E两个功能片区分布在浦西地区。世博园A片区主要布置部分亚洲国家馆等场馆。世博园B片区主要布置世界主题馆、部分亚洲国家馆、大洋洲国家馆、国际组织馆等场馆。世博园C片区主要布置欧洲、美洲、非洲国家馆等场馆。世博园D片区主要布置城市足迹馆和企业馆等场馆。世博园E片区主要布置城市未来馆、企业馆和城市最佳实践区等场馆。世博会结束后，保留了一轴四馆，世博轴、世博中心、世博主题馆、世博文化中心、中国国家馆。</p><div class="content_img"><img src="./images/002.png"></div></div><div class="footer">世博园</div></div>
</body>
</html>

五、源码获取

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

相关文章：

HTML静态网页成品作业(HTML+CSS)——世博园介绍(2个页面)

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

编程日记 2024/3/19 16:50:59

微信小程序订阅消息授权弹窗事件

微信小程序消息订阅授权弹窗事件 &#xff0c;每次授权完成之后&#xff0c;只可以推送一条模板消息。 目录 1、HTML代码 2、JS代码 1、HTML代码 <button bindtap"openPopup" class"openPopup">订阅消息</button> 2、JS代码 // 是否设置过授…...

编程日记 2024/3/19 16:48:56

谷歌的后量子密码学威胁模型

1. 引言 若现在不使用量子安全算法来加密数据&#xff0c;能够存储当前通信的攻击者最快十年内就能对其解密。这种先存储后解密的攻击是当前采用后量子密码学 (post-quantum cryptography&#xff0c;PQC) 背后的主要动机&#xff0c;但其他未来的量子计算威胁也需要一个深思熟…...

编程日记 2024/3/19 16:44:52

机器人在果园内行巡检仿真

文章目录 创建工作空间仿真果园场景搭建小车模型搭建将机器人放在仿真世界中创建工作空间 mkdir -p ~/catkin_ws/src cd ~/catkin_ws仿真果园场景搭建 cd ~/catkin_ws/src git clone https://gitcode.com/clearpathrobotics/cpr_gazebo.git小车模型搭建 DiffBot是一种具有两个…...

编程日记 2024/3/19 16:43:51

蓝桥杯算法基础（14）：十大排序算法（归并排序）c语言版

归并排序 基于分而治之的思想&#xff0c;拿两个已经有序的序列重新组合成一个新的有序序列. 这是一个简单的合并函数&#xff0c;需要两个序列都有序 //默认a和b数组都是有序的 //temp为一个数组的首地址 void mergeSort(int a[],int,alen,int b[],int blen,int* temp){int …...

编程日记 2024/3/19 16:34:43

力扣刷题(DAY09-DAY11)

Day09 0958. 二叉树的完全性检验 知识点&#xff1a;完全二叉树&#xff1a;在一棵完全二叉树中&#xff0c;除了最后一层外&#xff0c;所有层都被完全填满&#xff0c;并且最后一层中的所有节点都尽可能靠左。最后一层&#xff08;第 h 层&#xff09;中可以包含 1 到 个节点…...

编程日记 2024/3/19 16:29:38

IPC之管道

什么是管道&#xff1f; 管道的本质是操作系统在内核中创建出的一块缓冲区&#xff0c;也就是内存 管道的应用 $ ps aux | grep xxx ps aux 的标准输出写到管道&#xff0c;grep 从管道这块内存中读取数据来作为它的一个标准输入&#xff0c;而且 ps 和 grep 之间是兄弟关系&a…...

编程日记 2024/3/19 16:28:36

VUE-组件间通信（二）$emit

$emit 1、单向绑定 子组件向父组件传值 2、使用示例 父组件 <template><div id"app"><!-- 监听自定义触发事件 emitInvokeEvents--><SonDemo emitInvokeEvents"fatherFunction"></SonDemo></div> </template&…...

编程日记 2024/3/19 16:26:33

java 程序连接 redis 集群 的时候报错 MUTLI is currently not supported in cluster mode

找了半天找不到,为什么国内文章环境是真的差&#xff0c; redis 集群不支持事务&#xff0c;而你的方法上面估计使用了 spring 的事务导致错误具体解决&#xff1a; Transactional(propagation Propagation.NOT_SUPPORTED)public <T> void removeMultiCacheMapValue…...

编程日记 2024/3/19 16:25:32

AVP-SLAM：自动泊车系统中的语义SLAM_

AVP-SLAM&#xff1a;自动泊车系统中的语义SLAM 附赠最强自动驾驶学习资料&#xff1a;直达链接 ●论文摘要 在自动代客泊车系统中车辆在狭窄且拥挤且没有GPS信号的停车场中进行导航&#xff0c;具备准确的定位能力是至关重要的。传统的基于视觉的方法由于在停车场中由于缺少…...

编程日记 2024/3/19 16:20:26

PHP反序列化--pop链

目录 一、了解pop链 1、pop链&#xff1a; 2、pop链触发规则&#xff1a; &#xff08;1&#xff09;通过普通函数触发&#xff1a; &#xff08;2&#xff09;通过魔术方法触发&#xff1a; 3、pop链魔术方法例题&#xff1a; 一、了解pop链 1、pop链&#xff1a; pop链…...

编程日记 2024/3/19 16:19:25

单片机中的几种周期（振动/时钟，状态，机械，指令周期）表示的含义（51为例）

几种周期含义及个人理解描述 参考&#xff1a;短文&#xff0c;参考&#xff0c;百度 个人理解简述&#xff1a;对于几个周期性来说&#xff0c;可以认为是小单位的时间组合成了长时间。就像把一个数据赋值&#xff0c;这个是简单的一个机械周期能完成的动作&#xff0c;但需要…...

编程日记 2024/3/19 16:16:21

Spring Boot+Vue前后端分离项目如何部署到服务器

&#x1f31f; 前言 欢迎来到我的技术小宇宙&#xff01;&#x1f30c; 这里不仅是我记录技术点滴的后花园&#xff0c;也是我分享学习心得和项目经验的乐园。&#x1f4da; 无论你是技术小白还是资深大牛&#xff0c;这里总有一些内容能触动你的好奇心。&#x1f50d; &#x…...

编程日记 2024/3/19 16:11:16

【学习总结】Ubuntu中vscode用ROS插件调试C++程序

1、教程 参考博客&#xff1a; 【ROS】 在VScode中 ROS Debug 配置方法非常详细版 关于launch文件的配置&#xff1a; launch.json {"version": "0.2.0","configurations": [{"name": "ROS: Launch","request"…...

编程日记 2024/3/19 16:10:15

html--蝴蝶

<!DOCTYPE html> <html lang"en" > <head> <meta charset"UTF-8"> <title>蝴蝶飞舞</title> <link rel"stylesheet" href"https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.cs…...

编程日记 2024/3/19 16:08:11

线程的 sleep()方法和 yield()方法有什么区别？为什么 Thread 类的 sleep()和 yield ()方法是静态的？

该文章专注于面试，面试只要回答关键点即可，不需要对框架有非常深入的回答，如果你想应付面试，是足够了，抓住关键点 线程的 sleep()方法和 yield()方法有什么区别 sleep()方法： sleep()方法使当前线程进入休眠状态，即暂停执行一段时间。它是静态方法，属于Thread类，调用…...

编程日记 2024/3/19 16:03:05

Java进阶 Maven基础

资料格式 配置文件 com.itheima Java代码 Statement stat con.createStatement(); 示例 com.itheima 命令 mvn test - Maven简介 传统项目管理状态分析 Maven 是什么 Maven的本质是一个项目管理工具&#xff0c;将项目开发过程抽象成一个项目对象模型&#xff08;POM&…...

编程日记 2024/3/19 16:02:04

Spring Boot(六十八)：SpringBoot 整合Apache tika 实现文档内容解析

1 Apache Tika 介绍 Apache Tika 是一个开源的内容检测和分析框架，由Apache软件基金会开发和维护的顶级项目。它可以从各种格式的文件中提取元数据和文本内容。Tika非常适合处理全文搜索、内容分析、翻译、内容提取等需要大量处理和分析文档内容的任务。Apache Tika提供了多种…...

编程日记 2024/3/19 16:01:02

jQuery+CSS3自动轮播焦点图特效源码

jQueryCSS3自动轮播焦点图特效源码&#xff0c;源码由HTMLCSSJS组成&#xff0c;双击html文件可以本地运行效果&#xff0c;也可以上传到服务器里面 下载地址 jQueryCSS3自动轮播焦点图特效源码...

编程日记 2024/3/19 15:56:56

面试经典150题(114-118)

leetcode 150道题 计划花两个月时候刷完之未完成后转&#xff0c;今天完成了5道(114-118)150 gap 了一周&#xff0c;以后就不记录时间了。。 114.(70. 爬楼梯) 题目描述&#xff1a; 假设你正在爬楼梯。需要 n 阶你才能到达楼顶。 每次你可以爬 1 或 2 个台阶。你有多少种不…...

编程日记 2024/3/19 15:54:54

基于FPGA的PID算法学习———实现PID比例控制算法

基于FPGA的PID算法学习 前言一、PID算法分析二、PID仿真分析1. PID代码2.PI代码3.P代码4.顶层5.测试文件6.仿真波形 总结 前言 学习内容&#xff1a;参考网站&#xff1a; PID算法控制 PID即&#xff1a;Proportional&#xff08;比例&#xff09;、Integral&#xff08;积分&…...

编程新知 2026/2/6 17:50:11

树莓派超全系列教程文档--(61)树莓派摄像头高级使用方法

树莓派摄像头高级使用方法 配置通过调谐文件来调整相机行为 使用多个摄像头安装 libcam 和 rpicam-apps依赖关系开发包 文章来源&#xff1a; http://raspberry.dns8844.cn/documentation 原文网址 配置 大多数用例自动工作&#xff0c;无需更改相机配置。但是&#xff0c;一…...

编程新知 2026/2/5 4:39:03

PHP和Node.js哪个更爽?

先说结论&#xff0c;rust完胜。 php&#xff1a;laravel&#xff0c;swoole&#xff0c;webman&#xff0c;最开始在苏宁的时候写了几年php&#xff0c;当时觉得php真的是世界上最好的语言&#xff0c;因为当初活在舒适圈里&#xff0c;不愿意跳出来&#xff0c;就好比当初活在…...

编程新知 2025/9/14 7:59:52

MVC 数据库

MVC 数据库 引言 在软件开发领域，Model-View-Controller（MVC）是一种流行的软件架构模式，它将应用程序分为三个核心组件：模型（Model）、视图（View）和控制器（Controller）。这种模式有助于提高代码的可维护性和可扩展性。本文将深入探讨MVC架构与数据库之间的关系，以…...

编程新知 2025/10/30 4:58:11

【学习笔记】深入理解Java虚拟机学习笔记——第4章 虚拟机性能监控，故障处理工具

第2章 虚拟机性能监控&#xff0c;故障处理工具 4.1 概述 略 4.2 基础故障处理工具 4.2.1 jps:虚拟机进程状况工具 命令&#xff1a;jps [options] [hostid] 功能&#xff1a;本地虚拟机进程显示进程ID&#xff08;与ps相同&#xff09;&#xff0c;可同时显示主类&#x…...

编程新知 2026/1/15 1:34:10

精益数据分析（97/126）：邮件营销与用户参与度的关键指标优化指南

精益数据分析&#xff08;97/126&#xff09;&#xff1a;邮件营销与用户参与度的关键指标优化指南 在数字化营销时代&#xff0c;邮件列表效度、用户参与度和网站性能等指标往往决定着创业公司的增长成败。今天&#xff0c;我们将深入解析邮件打开率、网站可用性、页面参与时…...

编程新知 2025/12/13 4:04:33

大语言模型（LLM）中的KV缓存压缩与动态稀疏注意力机制设计

随着大语言模型&#xff08;LLM&#xff09;参数规模的增长&#xff0c;推理阶段的内存占用和计算复杂度成为核心挑战。传统注意力机制的计算复杂度随序列长度呈二次方增长&#xff0c;而KV缓存的内存消耗可能高达数十GB&#xff08;例如Llama2-7B处理100K token时需50GB内存&a…...

编程新知 2026/1/28 1:40:03

python报错No module named ‘tensorflow.keras‘

是由于不同版本的tensorflow下的keras所在的路径不同&#xff0c;结合所安装的tensorflow的目录结构修改from语句即可。 原语句&#xff1a; from tensorflow.keras.layers import Conv1D, MaxPooling1D, LSTM, Dense 修改后&#xff1a; from tensorflow.python.keras.lay…...

编程新知 2025/9/24 7:39:50

九天毕昇深度学习平台 | 如何安装库？

pip install 库名 -i https://pypi.tuna.tsinghua.edu.cn/simple --user 举个例子&#xff1a; 报错 ModuleNotFoundError: No module named torch 那么我需要安装 torch pip install torch -i https://pypi.tuna.tsinghua.edu.cn/simple --user pip install 库名&#x…...

编程新知 2026/1/31 2:13:57

基于Springboot+Vue的办公管理系统

角色&#xff1a; 管理员、员工 技术&#xff1a; 后端: SpringBoot, Vue2, MySQL, Mybatis-Plus 前端: Vue2, Element-UI, Axios, Echarts, Vue-Router 核心功能&#xff1a; 该办公管理系统是一个综合性的企业内部管理平台&#xff0c;旨在提升企业运营效率和员工管理水…...

编程新知 2026/1/31 8:55:37