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

HTML静态网页成品作业(HTML+CSS)——家乡广州介绍设计制作(5个页面)

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

文章目录

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


一、作品介绍

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

二、作品演示

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

在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码


<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"> <title>家乡简介</title><link href="css/css.css" rel="stylesheet" type="text/css" />
<body>
<div><audio src="media/1.mp3" autoplay=""></audio><!--音频--><div class="banner"><img src="images/banner.jpg"></div><div class="gundong"><marquee><p>欢迎访问我的网站</p></marquee></div><div class="nav"><a href="index.html">家乡简介</a><a href="meishi.html">特色美食</a><a href="zhaopian.html">美景照片</a><a href="fengjing.html">景点介绍</a><a href="shipin.html">美食视频</a></div><div class="main"><div class="cont">         <p>广州,简称穗,别称羊城、花城,是广东省会、副省级市,中国国家中心城市,世界著名的港口城市,国家重要的经济、金融、贸易、交通、会展和航运中心。从秦朝开始,广州一直是郡治、州治、府治的行政中心。二千多年来一直都是华南地区的政治、军事、经济、文化和科教中心。广州文化主要是属于岭南文化的"广府文化",客家文化次之。1982年广州被中国国务院公布为中国第一批国家历史文化名城。 </p><p>广州地处中国大陆南方、广东省中南部、珠江三角洲北缘,是中国的南大门,国家综合交通枢纽,国务院定位的国际大都市和国家三大综合性门户城市之一,与北京、上海并称"北上广",社会经济文化辐射力直指东南亚。</p><p>广州是中国近现代革命的策源地。1911年爆发的广州"三·二九"起义,打响了辛亥革命第一枪,拉开了辛亥革命的序幕.</p><p>广州作为中国最大、历史最悠久的对外通商口岸和海上丝绸之路的起点之一,有"千年商都"之称。加上外国人士众多,也被称为"第三世界首都"</p><img src="images/jiaxiang1.jpg"><img src="images/jiaxiang2.jpg"></div></div><div class="foot"><p>家乡美食美景介绍</p></div>
</body>
</html>

五、源码获取

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

相关文章:

HTML静态网页成品作业(HTML+CSS)——家乡广州介绍设计制作(5个页面)

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

【Java IO流】缓冲流和对象流的解析和应用实例

目录 前言 一、缓冲流 四种方式拷贝文件的用时对比 二、对象流 1. 使用对象流写入对象到本地文件 2. 使用对象流读取对象数据 总结 前言 【File文件管理及IO流&#xff08;基本流&#xff09;】http://t.csdnimg.cn/uG5Ff 该篇博客中&#xff0c;介绍了学习高级流需要的…...

鸿蒙Harmony应用开发—ArkTS声明式开发(基础手势:Select)

提供下拉选择菜单&#xff0c;可以让用户在多个选项之间选择。 说明&#xff1a; 该组件从API Version 8开始支持。后续版本如有新增内容&#xff0c;则采用上角标单独标记该内容的起始版本。 子组件 无 接口 Select(options: Array<SelectOption>) 参数&#xff1a;…...

mysql将一个表另存为新表,同时复制索引、约束、主键等信息

使用 SHOW CREATE TABLE 语句获取原表的创建语句&#xff1a; SHOW CREATE TABLE 原表名;将 原表名 替换为要复制的原始表的名称。 此语句将返回一个包含原表完整创建语句的结果集。创建语句包括表的结构、列定义、索引、约束、主键等所有信息。 复制结果集中的创建语句&…...

基于springboot+vue的房屋交易平台

博主主页&#xff1a;猫头鹰源码 博主简介&#xff1a;Java领域优质创作者、CSDN博客专家、阿里云专家博主、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战&#xff0c;欢迎高校老师\讲师\同行交流合作 ​主要内容&#xff1a;毕业设计(Javaweb项目|小程序|Pyt…...

17个工作必备的Python自动化代码分享(上篇)

引言 Python是一种流行的编程语言&#xff0c;以其简单性和可读性而闻名。因其能够提供大量的库和模块&#xff0c;它成为了自动化各种任务的绝佳选择。让我们进入自动化的世界&#xff0c;探索17个可以简化工作并节省时间精力的Python脚本。 目录&#xff08;上篇&#xff0…...

python-0008-修改django数据库为mysql

操作系统 centos7 执行 在虚拟环境中执行&#xff1a; pip3 install mysqlclient2.2.4 -i https://mirrors.aliyun.com/pypi/simple无法安装问题 如果安装mysqlclient时提示找不到对应的版本&#xff0c;或者编译失败&#xff0c;请退出虚拟环境&#xff0c;执行以下操作&…...

oracle用户密码过期

很久不用的项目遇到报错 2024-03-14 11:15:01.806 [Druid-ConnectionPool-Create-110651474] ERROR com.alibaba.druid.pool.DruidDataSource 2879 - create connection SQLException, url: jdbc:oracle:thin://192.168.0.54:1521/orcl, errorCode 28001, state 99999 java.sq…...

安全地使用v-html

vue2 1、 使用插件DOMPurify DOMPurify是一个开源的基于DOM的快速XSS净化工具。输入HTML元素,然后通过DOM解析递归元素节点,进行净化,输出安全的HTML <div v-html"sanitizedContent"></div>import DOMPurify from dompurify; data () {return {htmlCont…...

MongoDB从0到1:高效数据使用方法

MongoDB&#xff0c;作为一种流行的NoSQL数据库。从基础的文档存储到复杂的聚合查询&#xff0c;从索引优化到数据安全都有其独特之处。文末附MongoDB常用命令大全。 目录 1. 引言 MongoDB简介 MongoDB的优势和应用场景 2. 基础篇 安装和配置MongoDB MongoDB基本概念 使…...

Go——运算符,变量和常量,基本类型

一.运算符 Go语言内置的运算符有&#xff1a; 算术运算符 关系运算符 逻辑运算符 位运算符 赋值运算符 1.1 算术运算符 注意&#xff1a;(自增)和--(自减)在go语言中是单独的语句&#xff0c;并不是运算符。 1.2 关系运算符 1.3 逻辑运算符 1.4 位运算符 位运算符对整数在内存…...

js使用canvas实现图片鼠标滚轮放大缩小拖拽预览,显示像素坐标,显示像素值

html代码 todo 实现画矩形框&#xff0c;圆形roi <!DOCTYPE html> <html lang"en"> <head> <meta charset"UTF-8"> <meta name"viewport" content"widthdevice-width, initial-scale1.0"> <title&…...

ArrayList 源码解析和设计思路

ArrayList 一、继承体系二、接口继承三、标记接口四、设计目的五、框架总体结构六、工作原理七、创建List对象初始化&#xff1f;还是add()添加元素初始化?七、add(E e)添加元素八、remove&#xff08;int index&#xff09;删除元素八、线程安全问题 一、继承体系 ArrayLis…...

Win10系统使用IIS服务搭建WebDAV网站结合内网穿透公网访问本地文件

文章目录 推荐1. 安装IIS必要WebDav组件2. 客户端测试3. cpolar内网穿透3.1 打开Web-UI管理界面3.2 创建隧道3.3 查看在线隧道列表3.4 浏览器访问测试 4. 安装Raidrive客户端4.1 连接WebDav服务器4.2 连接成功4.2 连接成功总结&#xff1a; 推荐 前些天发现了一个巨牛的人工智能…...

AWTK 开源串口屏的配置文件

配置文件 每个 HMI 应用程序都需要一个配置文件&#xff0c;用于配置 HMI 的基本信息、服务、持久化、告警信息、历史数据等。 文件位置 design/default/data/settings.json基本配置 name - 名称&#xff08;必须配置&#xff0c;只能用字母、数字、下划线&#xff09; se…...

Spring、SpringMVC、Spring Boot常见注解有哪些?不要混淆了哦

Spring、SpringMVC、Spring Boot常见注解 一、Spring 注解说明Component、Controller、Service、Repository使用在类上用于实例化BeanAutowired使用在字段上用于根据类型依赖注入Qualifier结合Autowired一起使用用于根据名称进行依赖注入Scope标注Bean的作用范围Configuratio…...

在notion里面实现四象限清单

四象限清单是一种时间管理工具&#xff0c;旨在帮助人们根据任务的重要性和紧急性来优先排序他们的工作。这个概念最早由德怀特艾森豪威尔提出&#xff0c;后来又被史蒂芬柯维在他的著作《高效能人士的七个习惯》中进一步普及。四象限清单将任务分为四个类别&#xff1a; 第一…...

【linux】搜索所有目录和子目录下的包含.git的文件并删除

一、linux命令搜索所有目录和子目录下的包含.git的文件 在Linux系统中&#xff0c;要搜索所有目录和子目录下的包含.git的文件&#xff0c;可以使用find命令。find命令允许指定路径、表达式和操作来查找文件。 以下是使用find命令搜索包含.git的文件的方法&#xff1a; 1. 基…...

三、传输层拥塞控制、差错控制

3.1 概述和传输层服务 传输服务和协议&#xff1a; 为运行在不同主机上的应用进程提供逻辑通信&#xff1b; 传输协议运行在端系统-发送方:将应用层的报文分成报文段&#xff0c;然后传递给网络层&#xff1b;接收方&#xff1a;将报文段重组成报文&#xff0c;然后传递给应用…...

主流电商平台数据大规模数据采集接口的实现:电商API接口接入方案和电商数据采集现状

现实问题 1、您是否需要经常统计关注的品牌、产品、平台、卖家的电商数据&#xff0c;包括销量、评价量、收藏量、预售量、运费、赠品和促销信息&#xff0c;手头上没有稳定的数据源&#xff1f; 2、您是否经常需要统计授权卖家和非授权卖家的销售、动销占比&#xff0c;分析…...

【网络安全产品大调研系列】2. 体验漏洞扫描

前言 2023 年漏洞扫描服务市场规模预计为 3.06&#xff08;十亿美元&#xff09;。漏洞扫描服务市场行业预计将从 2024 年的 3.48&#xff08;十亿美元&#xff09;增长到 2032 年的 9.54&#xff08;十亿美元&#xff09;。预测期内漏洞扫描服务市场 CAGR&#xff08;增长率&…...

【2025年】解决Burpsuite抓不到https包的问题

环境&#xff1a;windows11 burpsuite:2025.5 在抓取https网站时&#xff0c;burpsuite抓取不到https数据包&#xff0c;只显示&#xff1a; 解决该问题只需如下三个步骤&#xff1a; 1、浏览器中访问 http://burp 2、下载 CA certificate 证书 3、在设置--隐私与安全--…...

如何为服务器生成TLS证书

TLS&#xff08;Transport Layer Security&#xff09;证书是确保网络通信安全的重要手段&#xff0c;它通过加密技术保护传输的数据不被窃听和篡改。在服务器上配置TLS证书&#xff0c;可以使用户通过HTTPS协议安全地访问您的网站。本文将详细介绍如何在服务器上生成一个TLS证…...

【单片机期末】单片机系统设计

主要内容&#xff1a;系统状态机&#xff0c;系统时基&#xff0c;系统需求分析&#xff0c;系统构建&#xff0c;系统状态流图 一、题目要求 二、绘制系统状态流图 题目&#xff1a;根据上述描述绘制系统状态流图&#xff0c;注明状态转移条件及方向。 三、利用定时器产生时…...

css的定位(position)详解:相对定位 绝对定位 固定定位

在 CSS 中&#xff0c;元素的定位通过 position 属性控制&#xff0c;共有 5 种定位模式&#xff1a;static&#xff08;静态定位&#xff09;、relative&#xff08;相对定位&#xff09;、absolute&#xff08;绝对定位&#xff09;、fixed&#xff08;固定定位&#xff09;和…...

Caliper 配置文件解析:config.yaml

Caliper 是一个区块链性能基准测试工具,用于评估不同区块链平台的性能。下面我将详细解释你提供的 fisco-bcos.json 文件结构,并说明它与 config.yaml 文件的关系。 fisco-bcos.json 文件解析 这个文件是针对 FISCO-BCOS 区块链网络的 Caliper 配置文件,主要包含以下几个部…...

Spring数据访问模块设计

前面我们已经完成了IoC和web模块的设计&#xff0c;聪明的码友立马就知道了&#xff0c;该到数据访问模块了&#xff0c;要不就这俩玩个6啊&#xff0c;查库势在必行&#xff0c;至此&#xff0c;它来了。 一、核心设计理念 1、痛点在哪 应用离不开数据&#xff08;数据库、No…...

保姆级教程:在无网络无显卡的Windows电脑的vscode本地部署deepseek

文章目录 1 前言2 部署流程2.1 准备工作2.2 Ollama2.2.1 使用有网络的电脑下载Ollama2.2.2 安装Ollama&#xff08;有网络的电脑&#xff09;2.2.3 安装Ollama&#xff08;无网络的电脑&#xff09;2.2.4 安装验证2.2.5 修改大模型安装位置2.2.6 下载Deepseek模型 2.3 将deepse…...

CVE-2020-17519源码分析与漏洞复现(Flink 任意文件读取)

漏洞概览 漏洞名称&#xff1a;Apache Flink REST API 任意文件读取漏洞CVE编号&#xff1a;CVE-2020-17519CVSS评分&#xff1a;7.5影响版本&#xff1a;Apache Flink 1.11.0、1.11.1、1.11.2修复版本&#xff1a;≥ 1.11.3 或 ≥ 1.12.0漏洞类型&#xff1a;路径遍历&#x…...

在 Spring Boot 项目里,MYSQL中json类型字段使用

前言&#xff1a; 因为程序特殊需求导致&#xff0c;需要mysql数据库存储json类型数据&#xff0c;因此记录一下使用流程 1.java实体中新增字段 private List<User> users 2.增加mybatis-plus注解 TableField(typeHandler FastjsonTypeHandler.class) private Lis…...