HTML静态网页成品作业(HTML+CSS)——川西旅游介绍网页(2个页面)

news2024/11/17 19:39:21

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

文章目录

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


一、作品介绍

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

二、作品演示

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

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码


<div class="header">
			<div class="logo">
				美丽川西
			</div>
			<div class="nav">
				<a href="index.html" class="active">川西首页</a>
				<a href="./html/meijing.html" >川西美景</a>
			</div>
		</div>

		<div class="banner">
			<img src="./pic/banner.jpg">
		</div>
		<div class="main">
			
			<h2>川西简介</h2>
			<p>
				四川省西部与四川盆地西部的简称重名,现川西(四川省西部)又可指四川省行政区划西部的阿坝州甘孜州等名川西高原地区。
			</p>
			<p>
				历史上的“川西”指的是四川盆地里西部边缘地带,不包括川西高原,广义上来说包括成都、乐山 、德阳、眉山、雅安。
			</p>
			<p>
				而地理上的川西多指四川阿坝州甘孜州等地区。这个地区自然风景优美迷人,九寨沟、黄龙、卧龙自然保护区、四姑娘山、米亚罗风景区、九曲黄河十八弯等风景名胜都位于川西地区,是四川省风景最迷人的一个地区,也是旅游和户外的理想去处。
			</p>
			<div class="main_img">
				<img src="./pic/1.png" alt="">
				<img src="./pic/2.png" alt="">
				<img src="./pic/3.png" alt="">
			</div>
			<p>
				川西坝子,有“小江南”的美称,因其独特的自然地理条件孕育了独特的人文景观和风俗习惯,这点在现代作家李劼人的《死水微澜》中有详尽具体的描述。
			</p>
			<p>
				由于四川境内多山地、高原,盆地倒是面积小得多。盆地内丘陵纵横;高原上矗立着巍峨壮观的冰川、雪山。地势跌宕起伏,气候复杂多变。
			</p>
			<p>
				它又地处中国西南腹地,长江上游。是联接中国西南、西北和华中三大地区的天然纽带。东西南北文化在这里交流,长江黄河文明在这里融合。独特的巴蜀文化,神秘古朴的藏、羌、彝风情。数亿年的地质运动,造就了瑰丽险峻的巴蜀风光。独特的人文地理环境,孕育出了丰厚的文化积淀。
			</p>
			<div class="main_img">
				<img src="./pic/4.png" alt="">
				<img src="./pic/5.png" alt="">
			</div>
		</div>
		<!-- 底部 -->
		<div class="footer">
			美丽川西 版权所有
		</div>

五、源码获取

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

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

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

相关文章

java_方法重写(覆盖)

介绍 现在我们来试一下 代码 父类 package b;public class father_ {//father class//4attributepublic void cry() {System.out.println("小动物叫唤");} } package b; 子类 public class graduate extends father_ {public void cry() {//子类方法//非私有的属性和…

ROS | 自动导航

保存&加载地图&#xff1a; image:地图文件 resolution:地图分辨率&#xff08;珊格地图&#xff09; origin&#xff1a;地图左下标 第三个参数是偏转角度 加载创建好的yaml文件&#xff1a; 年轻人第一次导航&#xff1a; 全局规划器&#xff1a; 代价地图设置参数&#…

大数据开发面试题【Mysql篇】

181、mysql数据库中的引擎 用于数据存储、处理和保护数据的核心服务&#xff0c;不同的数据库引擎有其各自的特点&#xff0c;常见的引擎&#xff1a;InnoDB&#xff0c;Mylsam、Memory、Mrg_Mylsam、Blackhole innodb&#xff1a;是一个事务性存储引擎&#xff0c;提供了对事…

Android 14 - 绘制体系 - VSync(1)

整体框架 VsyncConfiguration&#xff1a;一些基本参数的配置类&#xff0c;比如PhaseOffsets、WorkDuration等。 Scheduler&#xff1a;作为SF生成和派发VSync的整体调度器&#xff0c;主要面向SurfaceFlinger提供VSync相关接口。Scheduler包含对所有屏幕的VSync的控制。本身是…

AI智能体|扣子Coze文生图功能接入微信公众号

大家好&#xff0c;我是无界生长。 AI智能体&#xff5c;扣子Coze文生图功能接入微信公众号本文分享了如何将Coze平台的文生图功能接入微信公众号的详细操作流程&#xff0c;包括创建图像流、创建并配置Bot、设置提示词和开场白、调试、发布等步骤。如果看完还没学会的话&…

【设计模式】创建型-工厂方法模式

前言 工厂方法模式是一种经典的创建型设计模式&#xff0c;它提供了一种灵活的方式来创建对象实例。通过本文&#xff0c;我们将深入探讨工厂方法模式的概念、结构和应用。 一、什么是工厂方法模式 工厂方法模式是一种创建型设计模式&#xff0c;旨在解决对象的创建过程和客…

B站尚硅谷git学习记录

文章目录 一、Git概述1.何为版本控制2.为什么需要版本控制3.版本控制工具 二、Git常用命令1.设置用户签名1.1 基本语法1.2 案例实操 2.初始化本地库2.1 基本语法2.2 案例实操 3.查看本地库状态3.1基本语法3.2 案例实操&#xff08;1&#xff09;首次查看&#xff08;工作区没有…

解决“nothing added to commit but untracked files present“

在执行git commit 命令时错误信息显示系统无法打开指定的设备或文件 &#xff0c;说明项目的文件没有“add”&#xff0c;需要先执行git add 文件名&#xff0c;然后再执行git commit -m “xxx” 直接先git add 文件名添加到缓冲区&#xff0c;再git commit -m “xxx”提交 gi…

[docker] docker 安全知识 - 镜像,port registry

[docker] docker 安全知识 - 镜像&#xff0c;port & registry 这是第一篇&#xff0c;安全部分还有一篇笔记就记完了 说实话&#xff0c;看完了要学的这些东西&#xff0c;感觉大多数安全问题都可以通过验证登录的合法性去解决 镜像 镜像的问题还是比较多的&#xff0…

数学建模--LaTeX的基本使用

目录 1.回顾 2.设置这个页眉和页脚 3.对于字体的相关设置 4.对于这个分级标题的设置 5.列表的使用 6.插入图片 1.回顾 &#xff08;1&#xff09;昨天我们了解到了这个latex的使用基本常识&#xff0c;以及这个宏包的概念&#xff0c;区域的划分&#xff0c;不同的代码代…

05.配置tomcat管理功能

认证失败&#xff0c;需要配置tomcat-users.xml文件 配置用户信息 [rootweb01 /application/tomcat/conf\]# tail tomcat-users.xml <role rolename"admin-gui"/> <role rolename"host-gui"/><role rolename"mana…

图解 Transformer

节前&#xff0c;我们星球组织了一场算法岗技术&面试讨论会&#xff0c;邀请了一些互联网大厂朋友、参加社招和校招面试的同学. 针对算法岗技术趋势、大模型落地项目经验分享、新手如何入门算法岗、该如何准备、面试常考点分享等热门话题进行了深入的讨论。 汇总合集&…

React(4): 使用 unocss + react-ts + vite 开发

React(4): 使用 unocss react ts 开发 之前一直使用 css-module 开发页面&#xff0c;觉得太过繁琐&#xff0c;看到 unocss , 眼前一亮&#xff0c;觉得可以拿来快速开发页面&#xff08;偷懒&#xff09; vite官网 unocss tailwindcss 说明 该方法需要对 tailwindcss 有一…

多态(难的起飞)

注意 virtual关键字&#xff1a; 1、可以修饰原函数&#xff0c;为了完成虚函数的重写&#xff0c;满足多态的条件之一 2、可以菱形继承中&#xff0c;去完成虚继承&#xff0c;解决数据冗余和二义性 两个地方使用了同一个关键字&#xff0c;但是它们互相一点关系都没有 虚函…

c++ 将指针转换为 void* 后,转换为怎么判断原指针类型?

当将指针转换为void后&#xff0c;擦除了指针所指向对象的类型信息&#xff0c;因此无法通过void指针来判断原始指针的类型。我这里有一套编程入门教程&#xff0c;不仅包含了详细的视频讲解&#xff0c;项目实战。如果你渴望学习编程&#xff0c;不妨点个关注&#xff0c;给个…

每日一题 <leetcode--2326.螺旋矩阵>

https://leetcode.cn/problems/spiral-matrix-iv/ 函数中给出的int* returnSize和int** returnColumnSizes是需要我们返回数值的&#xff0c;这点需要注意。其中int** returnColumnSizes 是需要额外开辟一块空间。 这道题我们首先需要malloc出一快空间来把链表存放在数组中&…

指纹识别经典图书、开源算法库、开源数据库

目录 1. 指纹识别书籍 1.1《精通Visual C指纹模式识别系统算法及实现》 1.2《Handbook of Fingerprint Recognition》 2. 指纹识别开源算法库 2.1 Hands on Fingerprint Recognition with OpenCV and Python 2.2 NIST Biometric Image Software (NBIS) 3. 指纹识别开源数…

QQ名片满级会员装x助手HTML源码

源码介绍 QQ名片满级会员展示生成HTML源码&#xff0c;源码由HTMLCSSJS组成&#xff0c;双击html文件可以本地运行效果&#xff0c;也可以上传到服务器里面&#xff0c;保存素材去选择QQ个性名片-选择大图模板-把图上传照片墙即可 源码效果 源码下载 蓝奏云&#xff1a;http…

Golang | Leetcode Golang题解之第116题填充每个节点的下一个右侧节点指针

题目&#xff1a; 题解&#xff1a; func connect(root *Node) *Node {if root nil {return root}// 每次循环从该层的最左侧节点开始for leftmost : root; leftmost.Left ! nil; leftmost leftmost.Left {// 通过 Next 遍历这一层节点&#xff0c;为下一层的节点更新 Next …

VS Code开发Python配置和使用教程

在Visual Studio Code (VSCode) 中配置和使用Python进行开发是一个相对直接的过程&#xff0c;下面是一份简明的指南&#xff0c;帮助你从零开始设置环境&#xff1a; 1. 安装Visual Studio Code 首先&#xff0c;确保你已经安装了Visual Studio Code。如果还没有安装&#x…