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

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

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

相关文章

Android Bundle putBinder传输超过1MB数据,Kotlin

Android Bundle putBinder传输超过1MB数据&#xff0c;Kotlin 由于Android系统架构的设计&#xff0c;Activity/Fragment之间通过Intent在Bundle塞进数据进行传输时候&#xff0c;如果数据超过1MB&#xff0c;会抛JE&#xff1a; java.lang.RuntimeException: android.os.Tran…

IDEA中配置完Maven后 重启就恢复默认设置

目录 问题描述解决方案-修改other settingsother settings改完也不奏效参考这里 问题描述 在IDEA的settings里配置完Maven之后 每次重启或新建一个项目/窗口之后 又恢复成之前的默认配置 解决方案-修改other settings 这和IDEA的版本有关 目前我使用的版本(2020.3.4) 配置完重…

计算机网络期末98+冲刺笔记

一、计算机网络基础 1.1计算机网络的概述 计算机网络的定义&#xff1a;利用通信设备和线路&#xff0c;将地理位置不同的具有独立功能的多台计算机机器外部设备连接起来&#xff0c;在网络操作系统、网络管理软件及网络通信协议的管理和协调下&#xff0c;实现资源共享和信息…

cpp qt 一个奇怪的bug

今天在用cpp qt的时候发现了一个奇怪的东西 这是我的源代码 #include "mywidget.h" #include <QPushButton>myWidget::myWidget(QWidget *parent): QWidget(parent) {QPushButton * btn1 new QPushButton;btn1->show();btn1->setParent(this);btn1-&g…

如何恢复丢失未保存的 Word 文档指南

在广阔的数字领域&#xff0c;对丢失未保存的 Word 文档的恐惧对于用户来说是再熟悉不过的焦虑了。本指南旨在对用户可能发现自己迫切需要恢复未保存文档的各种场景进行详尽的探索。无论是由于保存失败、意外的系统崩溃还是令人心碎的意外删除&#xff0c;请放心&#xff0c;我…

详解MySQL的MVCC(ReadView部分解析C++源码)

文章目录 1. 什么是MVCC2. MVCC核心组成&#xff08;三大件&#xff09;2.1 MVCC为什么需要三大件 3. 隐藏字段4. undo log4.1 模拟版本链数据形成过程 5. Read View5.1 m_ids5.2 m_creator_trx_id5.3 m_low_limit_id5.4 m_up_limit_id5.5 可见性分析算法 6. MVCC流程模拟6.1 R…

ChromeDriver 122 版本为例 国内下载地址及安装教程

ChromeDriver 国内下载地址 https://chromedriver.com/download 靠谱 千千万万别下载错了 先确认 Chrome 浏览器版本 以 win64 版本为例 那我们下载这一个啊&#xff0c;不要下载错了 下载地址贴在这哈 https://storage.googleapis.com/chrome-for-testing-public/122.0.…

低代码开发平台,快速搭建开源MES系统

MS低代码云MES作为一家专注于提供生产制造数字化方案的服务商&#xff0c;“以客户为中心”、以“数据驱动、智能化、互联化”为企业的核心标签&#xff0c;以低代码平台为切入点&#xff0c;帮助企业构建以人为本的未来供应链生态系统&#xff0c;实现制造企业的智能化转型。 …

Vulnhub - Toppo

希望和各位大佬一起学习&#xff0c;如果文章内容有错请多多指正&#xff0c;谢谢&#xff01; 个人博客链接&#xff1a;CH4SER的个人BLOG – Welcome To Ch4sers Blog Toppo 靶机下载地址&#xff1a;Toppo: 1 ~ VulnHub 0x01 信息收集 Nmap扫描目标主机&#xff0c;发…

关于分布式微服务数据源加密配置以及取巧方案(含自定义加密配置)

文章目录 前言Spring Cloud 第一代1、创建config server项目并加入加解密key2、启动项目&#xff0c;进行数据加密3、实际项目中的测试server Spring Cloud Alibaba低版本架构不支持&#xff0c;取巧实现无加密配置&#xff0c;联调环境问题加密数据源配置原理探究自定义加密解…

[LeetCode][110]平衡二叉树

题目 110.平衡二叉树 给定一个二叉树&#xff0c;判断它是否是平衡二叉树。 示例 1&#xff1a; 输入&#xff1a;root [3,9,20,null,null,15,7] 输出&#xff1a;true 示例 2&#xff1a; 输入&#xff1a;root [1,2,2,3,3,null,null,4,4] 输出&#xff1a;false 示例 3&…

Linux:1_常见指令以及权限理解(上)

常见指令以及权限理解 一.补充知识 为方便初学者更好的理解Linux系统,这部分将对比windows系统补充一部分必要知识1 2 3 4 5 6 二.补充指令 1. 重新认识指令: 指令本质都是程序 —指令、程序、可执行程序都是一回事(都是文件内容属性)指令就是程序 … 安装和卸载是在把可…

分布式搜索引擎elasticsearch(2)

1.DSL查询文档 elasticsearch的查询依然是基于JSON风格的DSL来实现的。 1.1.DSL查询分类 Elasticsearch提供了基于JSON的DSL&#xff08;[Domain Specific Language](https://www.elastic.co/guide/en/elasticsearch/reference/current/query-dsl.html)&#xff09;来定义查…

(一)RabbitMQ实战——rabbitmq的核心组件及其工作原理介绍

前言 RabbitMQ是一个开源的消息代理软件&#xff0c;它实现了高级消息队列协议&#xff08;AMQP&#xff09;标准&#xff0c;提供可靠的消息传递机制。RabbitMQ可以用于在应用程序之间传递消息&#xff0c;实现不同应用系统之间的解耦和通信。它支持多种编程语言&#xff0c;…

什么是Ribbon,怎么实现负载均衡?

一. Ribbon 是 Netflix 公司开发的一个负载均衡器&#xff08;Load Balancer&#xff09;工具&#xff0c;主要用于在分布式系统中进行客户端侧的负载均衡。它可以集成到微服务架构中的客户端&#xff0c;通过在客户端实现负载均衡算法&#xff0c;来分发请求到多个服务提供者…

彩虹知识付费模板MangoA全开源包含秒杀/抽奖/社群/推送等功能

二次开发增加以下功能每日秒杀每日签到官方社群多级分销在线抽奖项目投稿 每日秒杀 每日签到 官方社群 多级分销 在线抽奖 项目投稿 下载地址&#xff1a;https://pan.xunlei.com/s/VNstMfOecGliiqew7UIorsOnA1?pwdhywi#

<支持向量机算法(SVM:Support Vector Machine)>——《机器学习算法初识》

目录 一、⽀持向量机(SVM)算法 1 SVM算法导⼊ 2 SVM算法定义 2.1 定义 2.2 超平⾯最⼤间隔介绍 2.3 硬间隔和软间隔 2.3.1 硬间隔分类 2.3.2 软间隔分类 3 ⼩结 二、 SVM算法api初步使⽤ 三、 SVM算法原理 1 定义输⼊数据 2 线性可分⽀持向量机 3 SVM的计算过程与算…

Rust 构建开源 Pingora 框架可以与nginx媲美

一、概述 Cloudflare 为何弃用 Nginx&#xff0c;选择使用 Rust 重新构建新的代理 Pingora 框架。Cloudflare 成立于2010年&#xff0c;是一家领先的云服务提供商&#xff0c;专注于内容分发网络&#xff08;CDN&#xff09;和分布式域名解析。它提供一系列安全和性能优化服务…

【原创】[新增]ARCGIS之土地报备Txt、征地Xls格式批量导出Por旗舰版

一、软件简介 2024年新增旗舰版软件&#xff0c;本软件全新界面开发&#xff0c;保留原有软件功能及一些使用习惯&#xff0c;并集成了现已有的所有定制格式的支持&#xff0c;并增加自定义格式的导出&#xff1b;做到1N2&#xff08;即为1种通用版本N种定制格式导出txt、Xls&a…

c++的STL(4)-- list容器

list容器概述 list的容器的实现是使用双向链表的形式的数据结构实现的。(也有的编译器使用双向循环链表) 链表是一种数据结构&#xff0c;这种结构与数组的结构不同&#xff0c;链表的每个节点都存放有特定个数的指针(双向链表:两个(一个指向前面的元素&#xff0c;另一个指向…