HTML静态网页成品作业(HTML+CSS)——家乡漳州介绍设计制作(1个页面)

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

文章目录

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


一、作品介绍

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

二、作品演示

在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<div class="top"><div class="top_city"><img src="./images/logo.png" alt=""></div></div><div class="nav"><div class="width"><div><a href="#jj">漳州简介</a></div><div><a href="#jd">漳州景点</a></div><div><a href="#ms">特色美食</a></div><div><a href="#ms1">民俗文化</a></div></div></div><div class="content"><div class="width"><div class="content_title" id="jj">漳州简介</div><div class="content_1"><img src="./images/jj.jpeg" alt=""><div><p>漳州市,福建省辖地级市,中等城市,国务院批复确定的全国沿海经济开放区,是中国较早实行对外开放的地区之一。同时也是海峡西岸经济区中心城市,地处闽南金三角南端,陆域地处北纬23°34’~25°15’,东经116°54’~118°08′之间,全市陆地面积1.26万平方公里,海域面积1.86万平方公里。辖区地势由北西向东南倾斜,地貌依次为中低山、丘陵台地和冲海积平原,有福建省最大的平原——漳州平原。属亚热带季风性湿润气候。截至2021年,漳州辖4个市辖区、7个县,市政府驻芗城区。2022年末,漳州市常住人口506.8万人。</p><p>秦始皇二十五年(前222年),“秦已并天下”后,把闽越故地划为闽中郡,今漳州境时属闽中郡,为正式纳入中央版图之始。 唐垂拱二年(686年)十二月九日,建置漳州。境内有东山岛、漳州滨海火山国家地质公园、南靖土楼、云洞岩等景点。漳州市是国家历史文化名城、全国文明城市 、国家级文化生态保护区、国家卫生城市 、全国双拥模范城市、中国优秀旅游城市 。</p></div></div>

五、源码获取

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

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

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

相关文章

Python的特性——跟老吕学Python编程

Python的特性——跟老吕学Python编程 Python的特性1.Python易学易用2.Python是解释型语言3.Python是交互式的4.Python是一种多范式语言5.Python的标准库6.Python是开源的7.Python是跨平台的8.用于GUI应用程序的Python9.Python的数据库连接10.Python是可扩展的11.Python拥有活跃…

【golang】28、用 httptest 做 web server 的 controller 的单测

文章目录 一、构建 HTTP server1.1 model.go1.2 server.go1.3 curl 验证 server 功能1.3.1 新建1.3.2 查询1.3.3 更新1.3.4 删除 二、httptest 测试2.1 完整示例2.2 实现逻辑2.3 其他示例2.4 用 TestMain 避免重复的测试代码2.5 gin 框架的 httptest 一、构建 HTTP server 1.1…

ElementUI两个小坑

1.form表单绑定的是一个对象&#xff0c;表单里的一个输入项是对象的一个属性之一&#xff0c;修改输入项&#xff0c;表单没刷新的问题&#xff0c; <el-form :model"formData" :rules"rules" ref"editForm" class"demo-ruleForm"…

蓝牙耳机链接电脑莫名奇妙关机问题(QQ浏览器)

蓝牙耳机连接电脑听歌的时候&#xff0c;如果听歌软件是暴风影音&#xff0c;或者其它播放器&#xff0c;蓝牙不会自动关机&#xff0c;但如果是QQ浏览器&#xff0c;蓝牙耳机经常莫名其妙的关机&#xff0c;时间间隔忽长忽短&#xff0c;没有规律&#xff0c;解决办法就是重启…

考研C语言复习初阶(5)

目录 一.表达式求值 1.1隐式类型转换 1.2 算术转换 12.3 操作符的属性 二. 指针是什么&#xff1f; 三 指针和指针类型 3.1 指针-整数 3.2 指针的解引用 3.3 野指针 四.指针运算 4.1 指针-整数 4.2 指针-指针 4.3 指针的关系运算 5. 指针和数组 6. 二级指针 …

202012青少年软件编程(图形化) 等级考试试卷(一级)

青少年软件编程(图形化) 等级考试试卷(一级)2020年12月 第1题:【 单选题】 下面哪个区域是“舞台区” ?( ) A:A B:B C:C D:D 【正确答案】: B 【试题解析】 : 第2题:【 单选题】 下图为小猫的初始方向, 哪个积木可以让小猫面向正右方?( ) A: B: C:…

2024.3.11 训练记录(13)

继续补题 文章目录 ICPC 2018青岛I Soldier GameICPC 2018青岛K Airdrop ICPC 2018青岛I Soldier Game 题目链接 线段树 果然稍微复杂一点的线段树就很难实现啊&#xff0c;不看题解根本没反应过来是线段树 struct Node {int l, r, lb, rb, nb, b; } tr[N * 4];其中&#x…

一个Promise全新API

1. 资讯速览 最近&#xff0c;Promise 新出了一个方法&#xff0c;已经进入 Stage 3 &#xff08;候选阶段&#xff09; &#xff0c;相信很快就能达到 Stage 4 &#xff08;完成阶段&#xff09;&#xff0c;并在项目中广泛使用。 这个方法就是 Promise.withResolvers。它是…

【C++干货基地】面向对象核心概念与实践原理:拷贝构造函数的全面解读

&#x1f3ac; 鸽芷咕&#xff1a;个人主页 &#x1f525; 个人专栏: 《C干货基地》《粉丝福利》 ⛺️生活的理想&#xff0c;就是为了理想的生活! 引入 哈喽各位铁汁们好啊&#xff0c;我是博主鸽芷咕《C干货基地》是由我的襄阳家乡零食基地有感而发&#xff0c;不知道各位的…

游戏行业需要堡垒机吗?用哪款堡垒机好?

相信大家对于游戏都不陌生&#xff0c;上到老&#xff0c;下到小&#xff0c;越来越多的小伙伴开始玩游戏。随着游戏用户的增加&#xff0c;如何保障用户资料安全&#xff0c;如何确保游戏公司数据安全等是一个不容忽视的问题。因此不少人在问&#xff0c;游戏行业需要堡垒机吗…

系统设计 - SDK设计流程

▌从 0 到 1 开发 一般从 0 设计一款 SDK&#xff0c;总体上可以分为 5 个步骤&#xff1a;基础架构的设计、开放 API 接口设计、业务功能框架设计与开发、基础核心库设计与开发、打包与发布。 1. 第一步是基础架构设计&#xff0c;一个好的架构可主要从可读性、可扩展性、可维…

css3实现3D立方体旋转特效源码

源码介绍 CSS3自动旋转正方体3D特效是一款基于css3 keyframes属性制作的图片相册自动旋转立方体特效 效果展示 下载地址 css3实现3D立方体旋转特效代码

PCL点云处理之四点确定球心和半径(克拉默法则C++) (二百二十九)

PCL点云处理之四点确定球心和半径(克拉默法则C++) (二百二十九) 一、算法介绍二、算法实现1.代码2.结果一、算法介绍 相比于计算点坐标均值作为球心和某点到均值距离作为半径的快速计算法,这里介绍的方法更加适合精度要求较高的四点定球计算,下面是具体的实现代码,C++编…

搭建mysql主从复制(主主复制)

1&#xff1a;设主库允许远程连接(注意&#xff1a;设置账号密码必须使用的插件是mysql_native_password&#xff0c;其他的会连接失败) #切换到mysql这个数据库&#xff0c;修改user表中的host&#xff0c;使其可以实现远程连接 mysql>use mysql; mysql>update user se…

蓝牙系列十三:协议栈L2CAP层

L2CAP 全称为逻辑链路控制与适配协议(Logical Link Control and Adaptation Protocol)&#xff0c;位于基带层之上&#xff0c;将基带层的数据分组交换为便于高层应用的数据分组格式&#xff0c;并提供协议复用和服务质量交换等功能。 该层属于主机的内容&#xff0c;位于HCI层…

手写Mybatis自动填充插件

目录 一、Mybatis插件简介&#x1f959;二、工程创建及前期准备工作&#x1f96b;实现代码配置文件 三、插件核心代码实现&#x1f357;四、测试&#x1f953; 一、Mybatis插件简介&#x1f959; Mybatis插件运行原理及自定义插件_简述mybatis的插件运行原理,以及如何编写一个…

HTML 语义化:构建优质网页的关键

&#x1f90d; 前端开发工程师、技术日更博主、已过CET6 &#x1f368; 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 &#x1f560; 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 &#x1f35a; 蓝桥云课签约作者、上架课程《Vue.js 和 E…

深度学习与强化学习的绝妙融合:引领未来智能科技新潮流!

深度学习在强化学习中的应用已经取得了显著的成果&#xff0c;特别是在处理复杂环境和大规模数据方面。 一、概述 强化学习是一种独特的机器学习范式&#xff0c;其核心在于通过代理与环境的交互来学习最优行为策略。这种学习方式是试错性的&#xff0c;代理在不断地尝试、接…

【JavaScript】面试手撕深拷贝

&#x1f308;个人主页: 鑫宝Code &#x1f525;热门专栏: 闲话杂谈&#xff5c; 炫酷HTML | JavaScript基础 ​&#x1f4ab;个人格言: "如无必要&#xff0c;勿增实体" 文章目录 深拷贝的作用深浅拷贝的区别浅拷贝深拷贝 深拷贝实现方式JSON.parse(JSON.stringi…

微信小程序云开发教程——墨刀原型工具入门(素材面板)

引言 作为一个小白&#xff0c;小北要怎么在短时间内快速学会微信小程序原型设计&#xff1f; “时间紧&#xff0c;任务重”&#xff0c;这意味着学习时必须把握微信小程序原型设计中的重点、难点&#xff0c;而非面面俱到。 要在短时间内理解、掌握一个工具的使用&#xf…