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

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

文章目录

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


一、作品介绍

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

二、作品演示

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

三、代码目录

在这里插入图片描述

四、网站代码

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="k">
		<img class="toubu" src="./images/toubu.jpg" alt="">
		<ul class="nav">
			<li><a href="index.html" class="xuanzhong">首页简介</a></li>
			<li><a href="fengjing.html">风景名胜</a></li>
			<li><a href="meishi.html">地方美食</a></li>
		</ul>
		
		
		<div class="neirong">
			<div class="neirong1">
				<img class="neirong1_tupian" src="./images/neirong1.jpeg" alt="">
				<div class="neirong1_jieshao">
					山西省,简称“晋”,中华人民共和国省级行政区,省会太原市,位于中国华北,东与河北省为邻,西与陕西省相望,南与河南省接壤,北与内蒙古自治区毗连,介于北纬34°34′—40°44′,东经110°14′—114°33′之间,总面积15.67万平方千米。截至20239月,山西省共辖11个地级市。2023年末,山西省常住人口为3465.99万人。山西省地势呈东北斜向西南的平行四边形,是典型的为黄土覆盖的山地高原,地势东北高西南低。高原内部起伏不平,河谷纵横,地貌有山地、丘陵、高原、盆地、台地等,其中山地、丘陵占 80%。山西省地跨黄河、海河两大水系,河流属于自产外流型水系。山西省地处中纬度地带的内陆,属温带大陆性季风气候。 山西地处秦晋文化区,历史代表文化为“三晋文化” 。
				</div>
			</div>
			<div class="neirong_name">山西风光</div>
			<div class="neirong2">
				<div class="neirong2_tupian">
					<img src="./images/neirong2_1.jpg" alt="">
				</div>
				<div class="neirong2_tupian">
					<img src="./images/neirong2_2.jpg" alt="">
				</div>
				<div class="neirong2_tupian">
					<img src="./images/neirong2_3.jpg" alt="">
				</div>
				<div class="neirong2_tupian">
					<img src="./images/neirong2_4.jpg" alt="">
				</div>
				<div class="neirong2_tupian">
					<img src="./images/neirong2_5.jpeg" alt="">
				</div>
				<div class="neirong2_tupian">
					<img src="./images/neirong2_6.jpeg" alt="">
				</div>
			</div>
		</div>
		
		
		<div class="dibu">
			美丽山西 欢迎您
		</div>
	</div>
</body>
</html>

五、源码获取

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

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

使用Python保护或加密Excel文件的7种方法

目录 安装Python Excel库 Python 使用文档打开密码保护 Excel 文件 Python 使用文档修改密码保护 Excel 文件 Python 将 Excel 文件标记为最终版本 Python 保护 Excel 工作表 Python 在保护 Excel 工作表的同时允许编辑某些单元格 Python 锁定 Excel 工作表中的特定单元…

移植fatfs制作内存文件系统

本文目录 1、引言2、环境准备2.1 下载源码2.2 创建一个工程 3、移植3.1 修改配置3.2 修改diskio.c3.3 编写RAM驱动3.4 编写验证代码 4、验证 文章对应视频教程&#xff1a; 暂无&#xff0c;可以关注我的B站账号等待更新。 点击图片或链接访问我的B站主页~~~ 1、引言 在嵌入式…

GaN VCSEL:工艺革新引领精准波长控制新纪元

日本工程师们凭借精湛的技艺&#xff0c;开创了一种革命性的生产工艺&#xff0c;让VCSEL的制造达到了前所未有的高效与精准。这一成果由名城大学与国家先进工业科学技术研究所的精英们联手铸就&#xff0c;将氮化镓基VCSELs的商业化进程推向了新的高峰。它们将有望成为自适应前…

【Effective Web】常见的css居中方式

CSS居中方式 水平居中 text-align:center 适用范围&#xff1a;容器中都是行内元素 缺点&#xff1a;容器内所有元素都会居中&#xff0c;如果是文本描述需要左对齐&#xff0c;需要增加text-align:left覆盖 margin: 0 auto 适用范围&#xff1a;容器宽度固定。子元素宽度…

Linux-黑马程序员

目录 一、前言二、初识Linux1、操作系统&#xff08;1&#xff09;硬件和软件&#xff08;2&#xff09;操作系统 2、Linux3、虚拟机4、FinalShell5、WSL6、虚拟机快照 三、Linux基础命令1、Linux的目录结构2、Linux命令入门&#xff08;1&#xff09;Linux命令基础格式&#x…

优雅谈大模型11:Mistral

大模型技术论文不断&#xff0c;每个月总会新增上千篇。本专栏精选论文重点解读&#xff0c;主题还是围绕着行业实践和工程量产。若在某个环节出现卡点&#xff0c;可以回到大模型必备腔调或者LLM背后的基础模型新阅读。而最新科技&#xff08;Mamba,xLSTM,KAN&#xff09;则提…

tcp协议机制的总结(可靠性,提高性能),基于tcp的应用层协议,用udp如何实现可靠传输

目录 总结 引入 可靠性 ​编辑 分析 三次握手 提高性能 其他 常见的基于tcp应用层协议 用udp实现可靠传输 总结 引入 为什么tcp要比udp复杂的多? 因为它既要保证可靠性,又要兼顾性能 可靠性 分析 其中,序列号不止用来排序,还可以用在重传时去重 确认应答是机制中的…

618有什么值得推荐?2024数码产品推荐,轻松拿捏选购!

随着618购物节即将来临&#xff0c;你是否已被琳琅满目的商品所吸引&#xff0c;难以抉择&#xff1f;团团特意为你筛选出一系列经过亲身试验的优质好物&#xff0c;旨在帮助你在这场购物盛宴中迅速锁定心仪之选。这些推荐不仅走在时尚的前沿&#xff0c;更能满足你日常生活的各…

AUTOSAR学习

文章目录 前言1. 什么是autosar&#xff1f;1.1 AP&#xff08;自适应平台autosar&#xff09;1.2 CP&#xff08;经典平台autosar)1.3 我的疑问 2. 为什么会有autosar3.autosar的架构3.1 CP的架构3.1.1 应用软件层3.1.2 运行时环境3.1.3 基础软件层 3.2 AP的架构 4. 参考资料 …

软件测试分类介绍

大家好&#xff0c;软件测试是确保软件质量的关键环节之一&#xff0c;通过对软件系统的各个方面进行测试&#xff0c;可以发现和解决潜在的问题&#xff0c;提高软件的稳定性、可靠性和用户满意度。在软件测试领域&#xff0c;根据测试的目的、方法和对象的不同&#xff0c;可…

LLM大模型的挑战与未来,挑战大但是机遇更大!

大模型必然是未来很长一段时间我们工作生活的一部分&#xff0c;而对于这样一个与我们生活高度同频互动的“大家伙”&#xff0c;除了性能、效率、成本等问题外&#xff0c;大规模语言模型的安全问题几乎是大模型所面对的所有挑战之中的重中之重&#xff0c;机器幻觉是大模型目…

揭秘!wifi贴项目市场到底怎么样??

在共享经济市场中WiFi贴这个看似微小的项目&#xff0c;正逐渐散发出它独特的光芒。它的出现既充满了希望又伴随着疑惑&#xff1a;WiFi贴项目的真正面貌究竟如何&#xff1f;让我们一同揭开这神秘面纱。 首先&#xff0c;我们必须理解WiFi贴的本质&#xff1a;它由微火的罗经理…

【每日刷题】Day63

【每日刷题】Day63 &#x1f955;个人主页&#xff1a;开敲&#x1f349; &#x1f525;所属专栏&#xff1a;每日刷题&#x1f34d; &#x1f33c;文章目录&#x1f33c; 1. 414. 第三大的数 - 力扣&#xff08;LeetCode&#xff09; 2. 2265. 统计值等于子树平均值的节点数…

农业领域科技查新点提炼方法附案例!

农业学科是人类通过改造和利用生物有机体(植物、动物、微生物等)及各种自然资源(光、热、水、土壤等)生产出人类需求的农产品的过程&#xff0c;人类在这一过程中所积累的科学原理、技术、工艺和技能&#xff0c;统称为农业科学技术&#xff0c;该领域具有研究范围广、综合性强…

音乐APP界面设计步骤详解

伴随着互联网的迅速发展&#xff0c;许多与因特网相关的职位应运而生&#xff0c;UI界面设计师是因特网的核心职位之一。UI界面设计已经渗透到我们生活的方方面面&#xff0c;包括网站、应用程序或其它数字平台上的按钮、菜单布局、配色方案和排版。很多人认为 UI界面设计只是关…

计算机图形学入门12:纹理映射

1.问题 如上图所示&#xff0c;前面的内容已经知道怎么对物体进行着色&#xff0c;在球和地板上出现了不同的颜色&#xff0c;也就是定义了不同的kd颜色系数&#xff0c;那么如何在物体不同位置定义不同属性呢&#xff1f; 2.纹理映射 2.1什么是纹理映射 如上图球的表面贴上一…

探索Jetpack Compose中的高效导航库:Voyager项目

探索Jetpack Compose中的高效导航库&#xff1a;Voyager项目 在Jetpack Compose中实现高效、可扩展的导航是每个开发者的追求。Voyager作为一个多平台导航库&#xff0c;不仅与Jetpack Compose无缝集成&#xff0c;还提供了一套务实的API&#xff0c;帮助开发者创建单活动应用…

tvm实战踩坑

今天玩了一下tvm的安装 我要安装v0.14.0的版本 所以按照官网的方法 https://tvm.apache.org/docs/install/from_source.html#python-package-installation git clone --recursive https://github.com/apache/tvm tvmgit checkout v0.14.0recursive是很重要的 这一步可以替换成…

显卡GPU、CUDA、Pytorch版本对应即下载安装

显存大于4G的建议使用GPU版本的pytorch&#xff0c;低于4G建议使用CPU版本pytorch&#xff0c;直接使用命令安装对应版本即可 GPU版本的pytorch的使用需要显卡支持&#xff0c;需要先安装CUDA&#xff0c;即需要完成以下安装 1.查看显卡GPU支持的CUDA版本&#xff08;最高&…

Flutter系列:关于ensureInitialized()

Flutter系列 关于ensureInitialized() - 文章信息 - Author: 李俊才 (jcLee95) Visit me at CSDN: https://jclee95.blog.csdn.netMy WebSite&#xff1a;http://thispage.tech/Email: 291148484163.com. Shenzhen ChinaAddress of this article:https://blog.csdn.net/qq_28…