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

news2024/11/16 6:04:35

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

文章目录

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


一、作品介绍

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

二、作品演示

在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<div class="header">
			<img src="./images/logo.png" alt="">
		</div>
		<div class="nav">
			<ul>
				<li><a href="#main">沅陵首页</a></li>
				<li><a href="#weizhi">沅陵地理</a></li>
				<li><a href="#meishi">沅陵美食</a></li>
				<li><a href="#meijing">沅陵美景</a></li>
			</ul>
		</div>
		<div class="banner">
			<img src="./images/banner.jpg" alt="">
		</div>
		<div class="content">
			<div id="weizhi" class="weizhi">
				<div class="tit">
					<div class="tit_text">沅陵地理</div>
					<div class="tit_line"></div>
				</div>
				<div class="weizhi_content">
					<div class="weizhi_text">
						<p>
							沅(yuán)陵县,隶属于湖南省怀化市。地处湖南省西北部,怀化市北端,沅水中游,处武陵山南麓与雪峰山东北尾端交汇处。东与桃源、安化相连,南与溆浦、辰溪接壤,西与泸溪、古丈、永顺毗邻,北与张家界市永定区交界。介于东经110°0531″—111°0627″,北纬28°0448″—29°0226″之间,总面积5852平方千米。
						</p>
						<p>
							沅陵以始置故城北枕沅水,南傍高大土阜,古称高大土阜为陵而得名。随同县名始于汉初。因史上历为辰州府治地,所以又称辰州。境内有国保单位唐代龙兴讲寺、省保单位黔中郡遗址等历史文化遗存百余处,馆藏国家一级文物41件,“辰州傩戏”、“沅陵传统龙舟”被列入国家非物质文化遗产名录。
						</p>
					</div>
					<img src="./images/weizhi.jpg" alt="">
				</div>
			</div>
			<div id="meishi" class="meishi">
				<div class="tit">
					<div class="tit_text">沅陵美食</div>
					<div class="tit_line"></div>
				</div>
				<div class="meishi_content">
					<div class="meishi1">
						<img src="./images/meishi1.jpg" alt="">
						<div>沅陵猪脚粉</div>
					</div>
					<div class="meishi1">
						<img src="./images/meishi2.jpg" alt="">
						<div>沅陵晒兰</div>
					</div>
					<div class="meishi1">
						<img src="./images/meishi3.jpg" alt="">
						<div>沅陵腊肉</div>
					</div>
					<div class="meishi1">
						<img src="./images/meishi4.jpg" alt="">
						<div>沅陵枞菌</div>
					</div>
				</div>
			</div>


五、源码获取

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

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

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

相关文章

# WIN10/WIN11 找不到【应用商店 Microsoft.WindowsStore】怎么办?

WIN10/WIN11 找不到【应用商店 Microsoft.WindowsStore】怎么办&#xff1f; 解决方法&#xff1a; 1、右键【开始】菜单&#xff0c;点击【Windows PowerShell (管理员)】&#xff0c;输入&#xff1a; Get-AppxPackage -allusers | Select Name, PackageFullName 2、查询…

python 办公自动化-生成ppt文本和图

最终样式 代码实现 # 可编辑折线+写入文字 成功 # 问题: 设置字体类型和加粗和字体为微软雅黑,是只改了字母和数字的字体,中文没变化 pip install pptx_ea_font 这个库可以解决这个问题 import pandas as pd import pptx_ea_font import matplotlib.pyplot as plt from pp…

【基础算法总结】前缀和二

前缀和二 1.和为 K 的子数组2.和可被 K 整除的子数组3.连续数组4. 矩阵区域和 点赞&#x1f44d;&#x1f44d;收藏&#x1f31f;&#x1f31f;关注&#x1f496;&#x1f496; 你的支持是对我最大的鼓励&#xff0c;我们一起努力吧!&#x1f603;&#x1f603; 1.和为 K 的子数…

记录一次内存取证

1.情景复现 我姐姐的电脑坏了。我们非常幸运地恢复了这个内存转储。你的工作是从系统中获取她所有的重要文件。根据我们的记忆&#xff0c;我们突然看到一个黑色的窗口弹出&#xff0c;上面有一些正在执行的东西。崩溃发生时&#xff0c;她正试图画一些东西。这就是我们从崩溃…

1824python进销存管理系统mysql数据库Django结构layUI布局计算机软件工程网页

一、源码特点 python Django进销存管理系统是一套完善的web设计系统mysql数据库 &#xff0c;对理解python编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/S模式开发。 开发环境pycharm mysql 5.0 到5.5 依赖包 Django…

2024电激世界脉动-中国汽车品牌全球化制胜手册

来源&#xff1a;奥美Ogilvy&#xff1a; 近期历史回顾&#xff1a; 2024中国宏观经济专题报告-数据要素市场建设 2023-2024年度报告.pdf 2024制药与生化医疗技术产业链白皮书.pdf 从可再生能源到绿氢-中国投资助力埃及能源转型.pdf 2024有机旅行中国行业指引.pdf 2024中国技术…

connection problem,giving up

参考&#xff1a; https://zhuanlan.zhihu.com/p/93438433 仅仅安装 sudo apt-get install xrdp 在用RDP远程的时候总是卡在登录界面&#xff0c;connection problem,giving up&#xff0c; some problem… 第一步&#xff1a; sudo apt-get install xserver-xorg-core sudo…

CC工具箱使用指南:【淹没区分析(BHM)】

一、简介 群友定制工具。 这个工具适用面比较小。 工具的应用场景如下&#xff1a; 提供一个淹没区范围&#xff0c;类型是面要素。统计这个范围内的一些线、面要素的面积或长度。 给定的几个数据有&#xff1a;耕地、永久基本农田、房台、道路&#xff08;线&#xff09;…

英语语法早操练-(上)

说起语法宝宝感觉心里苦。那么多语法注意点&#xff0c;哪个都放不到心里&#xff0c;句子表达还是错。这种情况是浪费了80%的时间做了达不到20%效果的事情。 要想写出没有语法错误的句子&#xff0c;那至少得知道词性和句子成分。 词性就是名词、动词、形容词、介词等 句子成分…

R实验 正交试验设计与一元线性回归分析

实验目的&#xff1a; 掌握正交试验设计记号的意义&#xff1b;掌握正交试验设计的直观分析和方差分析&#xff1b;掌握一元线性回归模型的相关概念&#xff1b;掌握最小二乘法的思想&#xff1b;掌握一元线性回归方程的显著性检验和预测。 实验内容&#xff1a; &#xff11;…

联想应用商店开发者常见问题FAQ

Phone/Pad应用常见问题 应用上传FAQ Q. 上传apk包时&#xff0c;提示“该包名已存在”如何处理&#xff1f; A&#xff1a;若应用包名出现冲突&#xff0c;请先核实该账号是否已存在该包名产品&#xff0c;若不在该账号下&#xff0c;请进行应用认领。 Q. 应用是否可以授权…

如何判断自己的逆商(AQ)高低?

什么是逆商&#xff1f; 逆商指的是人们在面临困难挫折时&#xff0c;如何摆脱困难和挫折的能力。逆商简称为AQ&#xff0c;也叫抗挫折能力。 逆商&#xff08;Adversity Quotient&#xff0c;简称AQ&#xff09;&#xff0c;是指个体面对逆境时的反应方式和应对能力&#xff…

wps能打开caj文件吗?CAJ应该如何打开?caj转pdf

问题1&#xff1a;wps能打开caj文件吗&#xff1f; WPS不能直接打开CAJ文件。 CAJ是中国知网开发的一种文件格式&#xff0c;主要用于存储学术文献&#xff0c;需要使用专门的阅读器才能打开。 问题2&#xff1a;CAJ应该如何打开&#xff1f; 要打开CAJ文件&#xff0c;你可…

3本救命神刊!录用率≥98%,非预警,最快2天录用!

本救命神刊&#xff0c;录用率高&#xff0c;无预警&#xff0c;14年期刊编辑全程保驾护航&#xff0c;省心省力助你快速发表&#xff01; 进展超顺 SSCI 社科类SSCI • 影响因子&#xff1a;3.0-4.0 • 期刊分区&#xff1a;JCR2/3区&#xff0c;中科院3/4区 • Index&…

界面控件DevExtreme v23.2亮点 - 标签、表单、编辑器功能升级

DevExtreme拥有高性能的HTML5 / JavaScript小部件集合&#xff0c;使您可以利用现代Web开发堆栈&#xff08;包括React&#xff0c;Angular&#xff0c;ASP.NET Core&#xff0c;jQuery&#xff0c;Knockout等&#xff09;构建交互式的Web应用程序。从Angular和Reac&#xff0c…

Hadoop HA 搭建过程中报错:namenode格式化

问题描述&#xff1a; 在格式化namenode时&#xff0c;显示报错如下 2024-03-07 13:55:30,543 ERROR namenode.FSNamesystem: FSNamesystem initialization failed. java.io.IOException: Invalid configuration: a shared edits dir must not be specified if HA is not enab…

半藏酒业新零售分红制度拆解,起盘运营服务商

半藏酱酒招商模式&#xff0c;白酒合伙人模式&#xff0c;顶层模式设计 社群玩法用这几年的互联网词汇描述叫私域营销。虽然不走传统商超&#xff0c;酒桌之外很少能看到&#xff0c;但随着核心消费者裂变和流量汇聚&#xff0c;现在能见度越来越高&#xff0c;并溢出到达公域。…

盲人心理辅导课程:心灵的引路人

在这个快节奏的社会中&#xff0c;技术的每一次跃进都在悄然改变着人们的生活方式&#xff0c;尤其对于盲人群体&#xff0c;一款名为“蝙蝠避障”的辅助软件成为了他们探索世界的得力助手。通过实时避障与拍照识别功能&#xff0c;“蝙蝠避障”不仅保障了盲人朋友的日常安全&a…

哈根达斯线下连锁店后台管理系统原型

部件库预览链接&#xff1a;请与班主任联系获取原型文档 支持版本: Axrure RP 8 文件大小: 3MB 文档内容介绍 l原型目录 l原型界面 免费领取资料 添加班主任回复 “210407” 领取

【leetcode1944--队列中可以看到的人数】

有n人排成一个队列&#xff0c;从左到右编号为0到n-1&#xff0c;height数组记录每个人的身高&#xff0c;返回一个数组&#xff0c;记录每个人能看到几个人。 类比&#xff1a;山峰问题&#xff0c;高的后面的矮的看不见。 从后往前&#xff0c;最后一个元素入栈&#xff0c…