HTML静态网页成品作业(HTML+CSS)—— 家乡成都介绍网页(4个页面)

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

文章目录

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


一、作品介绍

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

二、作品演示

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

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>成都</title><link rel="stylesheet" href="./css/style.css">
</head>
<body><div class="mid"><div class="nav"><a href="index.html">网站首页</a><a href="lishi.html">成都历史</a><a href="jingdian.html">成都景点</a><a href="zaxianliuyan.html">在线留言</a></div><div class="banner"><img src="./images/banner.jpg" alt=""></div><div class="m"><div class="t">成都简介</div><div class="jianjie"><div class="jianjie_wenzi">成都市是中国首批国家历史文化名城之一,是古蜀文明的重要发源地,“天府之国”的中心,有着世界罕见的3000年城址不迁、2500年城名不改的历史特征。前316年,秦灭蜀,始设蜀郡并成都县。前311年,仿秦制重建城垣,为有文献记载的城市规划与建设之始,已有2300多年历史。汉因织锦业发达专设锦官管理,故有“锦官城”“锦城”之称,五代后蜀时遍种芙蓉,故别称“芙蓉城”“蓉城”。1921年,始设市政筹备处,1928年,正式设市。成都是重要的电子信息产业基地,成渝地区双城经济圈核心城市、区域经济中心、科技中心、世界文化名城和国际门户枢纽,西南地区的科技中心、商贸中心、金融中心和交通、通信枢纽,中国人民解放军西部战区机关驻地,是第31届世界大学生夏季运动会的举办地。20245月,入选承担数据标注基地建设任务城市名单。</div><div class="jianjie_pic"><img src="./images/jianjie.jpeg" alt=""></div></div><div class="t">成都特色美食</div><div class="meishi"><div class="meishi_1"><img src="./images/meishi_1.jpg" alt=""><div class="meishi_name">双流老妈兔头</div></div><div class="meishi_1"><img src="./images/meishi_2.png" alt=""><div class="meishi_name">夫妻肺片</div></div><div class="meishi_1"><img src="./images/meishi_3.jpeg" alt=""><div class="meishi_name">四川担担面</div></div><div class="meishi_1"><img src="./images/meishi_4.png" alt=""><div class="meishi_name">麻婆豆腐</div></div><div class="meishi_1"><img src="./images/meishi_5.jpeg" alt=""><div class="meishi_name">口水鸡</div></div><div class="meishi_1"><img src="./images/meishi_6.jpeg" alt=""><div class="meishi_name">冒菜</div></div></div></div><div class="footer">成都 版权所有</div></div>
</body>
</html>

五、源码获取

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

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

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

相关文章

【玩转google云】实战:如何在GKE上使用Helm安装和配置3节点的RabbitMQ集群

需求 因项目需要需要在Google Kubernetes Engine (GKE) 中使用Helm安装一个3节点的RabbitMQ集群,配置用户名和密码,开通公网访问的Web管理界面,指定namespace为mq,并使用5G的硬盘存储MQ的数据。 前提条件 GKE集群:确保你有一个运行中的GKE集群。Helm工具:确保已安装Hel…

Qt 插件框架

在Qt框架中实现插件系统主要涉及到使用Qt的插件机制来动态加载和卸载插件模块。 1、定义插件接口 首先&#xff0c;你需要定义一个或多个接口类&#xff0c;这些类将作为插件和主程序之间的契约。这些接口类通常包含纯虚函数&#xff0c;插件需要实现这些函数。 // MyPlug…

C语言 | Leetcode C语言题解之第164题最大间距

题目&#xff1a; 题解&#xff1a; int maximumGap(int* nums, int numsSize) {if (numsSize < 2) {return 0;}int maxVal INT_MIN, minVal INT_MAX;for (int i 0; i < numsSize; i) {maxVal fmax(maxVal, nums[i]);minVal fmin(minVal, nums[i]);}int d fmax(1,…

计算机网络:3数据链路层

数据链路层 概述封装成帧和透明传输帧透明传输&#xff08;填充字节或比特&#xff09;差错检测奇偶校验循环冗余校验CRC Cyclic Redundancy Check 可靠传输停止-等待协议回退n帧协议&#xff08;滑动窗口协议&#xff09;选择重传协议 点对点协议PPP共享式以太网网络适配器&am…

ubuntu版本升级命令记录

小版本升级(如22.04.3到22.04.4) 具体的版本控制并不常用于小版本升级&#xff0c;因为这些版本升级通常涵盖了安全补丁和错误修复。确保 /etc/apt/sources.list 中的软件源是正确的&#xff0c;并定期运行升级命令&#xff0c;系统将自动升级到最新的小版本。 # 检查当前版本…

java本地缓存(map,Guava,echcache,caffeine)优缺点,以及适用场景

前言 在高并发系统环境下&#xff0c;jvm本地缓存扮演着至关重要的角色&#xff0c;合理的应用能够使系统响应迅速&#xff0c;提高用户体验感&#xff0c;而分布式缓存redis则存在着网络io&#xff0c;以及流量消耗问题&#xff0c;需要和本地缓存搭配使用&#xff0c;才能使…

机器学习算法 —— K近邻(KNN分类)

🌟欢迎来到 我的博客 —— 探索技术的无限可能! 🌟博客的简介(文章目录) 目录 KNN的介绍和应用KNN的介绍1) KNN建立过程2) 类别的判定KNN的优点KNN的缺点KNN的应用实战KNN分类数据集 —— KNN分类库函数导入数据导入模型训练&可视化原理简析莺尾花数据集 —— KNN分…

微信小程序-API 本地存储

一.本地存储-同步API 存储 &#xff1a; wx.setStorageSync 获取&#xff1a;wx.getStorageSync 删除&#xff1a;wx.removeStorageSync 清空&#xff1a;wx.clearStorageSync 代码&#xff1a; save(){//存储wx.setStorageSync(id, 1) wx.setStorageSync(obj, {name:"te…

React+TS前台项目实战(十一)-- 全局常用组件提示语可复制Link组件封装

文章目录 前言HighLightLink组件1. 功能分析2. 代码详细注释3. 使用方式4. 效果展示 总结 前言 今天这篇讲的这个组件&#xff0c;是一个用于高亮显示文本并添加可选的跳转链接&#xff0c;提示文本&#xff0c;复制文本的 React 组件 HighLightLink组件 1. 功能分析 &#x…

【交易策略】#22-24 残差资金流强度因子

【交易策略】#22-24 残差资金流强度因子

路由控制和策略路由

文章目录 一、路由控制&#xff08;1&#xff09;、前言1.1.1-路由策略 &#xff08;2&#xff09;、正反掩码和通配符1.2.1-通配符 &#xff08;3&#xff09;、ACL1.3.1-ACL步长1.3.2-步长的作用1.3.3-TCP/UDP端口号 实验1:实验2: 二、前缀列表实验1:2.1.1-前缀列表的表达式2…

【图像分割】DSNet: A Novel Way to Use Atrous Convolutions in Semantic Segmentation

DSNet: A Novel Way to Use Atrous Convolutions in Semantic Segmentation 论文链接&#xff1a;http://arxiv.org/abs/2406.03702 代码链接&#xff1a;https://github.com/takaniwa/DSNet 一、摘要 重新审视了现代卷积神经网络&#xff08;CNNs&#xff09;中的atrous卷积…

找工作小项目:day16-重构核心库、使用智能指针(1)

day16-重构核心库、使用智能指针 今天是该项目开源在gthub的最后一天&#xff0c;我这里只是将我自己对于这个项目的理解进行总结&#xff0c;如有错误敬请包含指正&#xff0c;今天会整体理一遍代码&#xff0c;并使用智能指针管理整个项目。 1、common 头文件 定义宏用于…

/usr/bin/ld: 当搜索用于 /lib/i386-linux-gnu/libcuda.so 时跳过不兼容的 -lcuda

/usr/bin/ld: 当搜索用于 /lib/i386-linux-gnu/libcuda.so 时跳过不兼容的 -lcuda ![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/023dbdeb215b4b4580f7f54706e32af9.pn当使用unsloth做微调时&#xff0c;发现找不到libcuda&#xff0c;很自然想到需要软链接到最新…

线性代数|机器学习-P15矩阵A的低秩变换下的逆矩阵

文章目录 1. 单位矩阵的秩1变换1.1 功能说明1.2 证明 2. 单位矩阵 I n I_n In​的秩k变换3. 一般矩阵A的秩k变换 1. 单位矩阵的秩1变换 1.1 功能说明 假设我们有一个单位矩阵I&#xff0c;列向量u,v那么当我们对单位向量I减去秩为1的矩阵后&#xff0c;其逆等于多少&#xff…

IDEA2023中使用run Dashboard面板?实现批量运行微服务

1、直接点击Add service--->Run Configuration Type---->Spring Boot 2、这样就出现了run Dashboard面板&#xff0c;可同时运行多个工程模块&#xff0c;shift选中所有启动类组命名&#xff08;Group Configurations&#xff09; 3、启动所有的项目

自行车在线租赁管理系统

摘 要 新时代是一个快速发展的时代&#xff0c;信息革命正在各个行业蔓延。互联网拉近了 人们的距离&#xff0c;物质生活水平的提高平静地改变了人类消费的观念。人们对自行车 租赁行业的要求越来越高&#xff0c;这对传统的自行车租赁行业来说既是挑战也是机遇。 有必要提高…

selenium 3中等待方式

登录百度 &#xff08;一&#xff09; time.sleep&#xff08;3&#xff09; 强制等待 &#xff0c;一般调试的时候用 from selenium import webdriver import time from selenium.webdriver.common.by import Bydriver webdriver.Chrome() #打开浏览器驱动 driver.maximize…

安卓多媒体(音频录播、传统摄制、增强摄制)

本章介绍App开发常用的一些多媒体处理技术&#xff0c;主要包括&#xff1a;如何录制和播放音频&#xff0c;如何使用传统相机拍照和录像&#xff0c;如何截取视频画面&#xff0c;如何使用增强相机拍照和录像。 音频录播 本节介绍Android对音频的录播操作&#xff0c;内容包…

【AI应用探讨】— 字节豆包模型应用场景

目录 内部业务场景 教育行业 医疗领域 金融领域 制造业 用户服务 价格优势 内部业务场景 豆包大模型已在字节跳动内部的50多个业务和场景中得到应用&#xff0c;包括办公智能助手、电商导购、营销创作、编程助手等。它的日均处理能力达到1200亿tokens文本&#xff0c;生…