当前位置: 首页 > news >正文

HTML静态网页成品作业(HTML+CSS)—— 美食湘菜介绍网页(5个页面)

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

文章目录

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


一、作品介绍

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

二、作品演示

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

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<div class="header"><div class="w"><div class="logo"><img src="./images/logo.png" ></div><ul class="nav"><li class="active"><a href="index.html">首页</a></li><li><a href="fazhan.html">发展历史</a></li><li><a href="caixi.html">菜系特点</a></li><li><a href="caipin.html">经典菜品</a></li><li><a href="biaodan.html">在线表单</a></li></ul></div></div><div class="banner"><img src="./images/banner.jpg"></div><div class="content w"><div class="tit"><div class="tit_text">湘菜简介</div><div class="tit_line"></div></div><div class="jianjie"><div><p>湘菜,又叫湖南菜,是中国历史悠久的汉族八大菜系之一 [1],早在汉朝就已经形成菜系。以湘江流域、洞庭湖区和湘西山区三种地方风味为主。</p><p>湘菜制作精细,用料上比较广泛,口味多变,品种繁多;色泽上油重色浓,讲求实惠;品味上注重香辣、香鲜、软嫩;制法上以煨、炖、腊、蒸、炒诸法见称。</p><p>官府湘菜代表菜品以组庵湘菜为代表,如组庵豆腐、组庵鱼翅等;民间湘菜代表菜品有辣椒炒肉、剁椒鱼头、湘西外婆菜、吉首酸肉、牛肉粉,衡阳鱼粉,栖凤渡鱼粉,东安鸡,金鱼戏莲、永州血鸭、九嶷山兔、宁远酿豆腐、腊味合蒸、姊妹团子 、宁乡口味蛇、岳阳姜辣蛇等。</p></div><img src="./images/jianjie.jpeg" alt=""></div><div class="tit"><div class="tit_text">视频介绍</div><div class="tit_line"></div></div><video width="100%"   controls><source src="./video/video.mp4" type="video/mp4"></video></div><div class="footer">湘菜介绍网 版权所有</div>

五、源码获取

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

相关文章:

HTML静态网页成品作业(HTML+CSS)—— 美食湘菜介绍网页(5个页面)

&#x1f389;不定期分享源码&#xff0c;关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 &#x1f3f7;️本套采用HTMLCSS&#xff0c;未使用Javacsript代码&#xff0c;共有5个页面。 二、作品演示 三、代…...

使用redis构建简单的社交网站

Redis命令实践通常涉及对Redis服务器的直接操作&#xff0c;包括数据的增删改查以及管理Redis实例。以下是一些基本的Redis命令及其使用场景&#xff1a; 连接Redis服务器: 使用Redis客户端连接到Redis服务器&#xff1a;redis-cli 设置和获取键值对: SET key value&#xff1…...

【Java面试】九、微服务篇-SpringCloud(上)

文章目录 1、SpringCloud五大组件2、服务注册和发现2.1 Eurake2.2 Eurake和Nacos的区别 3、Ribbon负载均衡3.1 策略3.2 自定义负载均衡策略 4、服务雪崩与熔断降级4.1 服务雪崩4.2 服务降级4.3 服务熔断 5、服务限流5.1 Nginx限流5.2 网关限流 6、微服务监控7、面试 1、SpringC…...

Python 树状数组

树状数组&#xff08;Binary Indexed Tree, BIT&#xff09;&#xff0c;又称为斐波那契堆&#xff0c;是一种数据结构&#xff0c;用于高效地解决以下问题&#xff1a; 单点更新&#xff1a;在数组的某个位置增加或减少一个值。区间查询&#xff1a;查询数组中一段连续区间的…...

【QEMU中文手册】2.2 调用方式(持续更新中)

本文由 AI 翻译&#xff08;ChatGPT-4&#xff09;完成&#xff0c;并由作者进行人工校对。如有任何问题或建议&#xff0c;欢迎联系我。联系方式&#xff1a;jelin-shoutlook.com。 原文&#xff1a;Invocation — QEMU documentation qemu-system-x86_64 [选项] [磁盘镜像]磁…...

(函数)判断一句话中最长的单词(C语言)

一、运行结果&#xff1b; 二、源代码&#xff1b; # define _CRT_SECURE_NO_WARNINGS # include <stdio.h>//声明函数&#xff1b; int aiphabetic(char); int longest(char[]);int main() {//初始化变量值&#xff1b;int i;char line[100] { 0 };//获取用户输入字符…...

QT5.5.0中使用lambda表达式时遇到的问题

QT5.5中使用lambda表达式的遇到的error_qt中lamda不起作用-CSDN博客...

【Go语言精进之路】构建高效Go程序:了解切片实现原理并高效使用

&#x1f525; 个人主页&#xff1a;空白诗 文章目录 引言一、切片究竟是什么&#xff1f;1.1 基础的创建数组示例1.2 基础的创建切片示例1.3 切片与数组的关系 二、切片的高级特性&#xff1a;动态扩容2.1 使用 append 函数扩容2.2 容量管理与性能考量2.3 切片的截取与缩容 三…...

Python与C语言:深入探索两者的奥秘与差异

Python与C语言&#xff1a;深入探索两者的奥秘与差异 在编程的世界里&#xff0c;Python和C语言如同两位性格迥异的伙伴&#xff0c;各自拥有独特的魅力和应用场景。Python以其简洁易懂的语法和强大的库支持赢得了众多开发者的青睐&#xff0c;而C语言则以其接近硬件的低级特性…...

图像编解码器在AI绘画中的革新作用

随着人工智能技术的飞速发展&#xff0c;AI绘画已经从一个简单的概念演变为一个充满创意与可能性的领域。在这场技术与艺术的融合中&#xff0c;图像编解码器扮演着至关重要的角色。它们不仅提升了AI绘画的质量和效率&#xff0c;还拓宽了艺术创造的边界。本篇博客将深入探讨图…...

SecureCRT[po破] for Mac SSH终端操作工具[解] 安装教程

文章目录 效果一、准备工作二、开始安装1、双击运行软件&#xff0c;将其从左侧拖入右侧文件夹中&#xff0c;等待安装完毕2、 应用程序显示软件图标&#xff0c;表示安装成功 三、输入对应参数1、解决“软件已损坏&#xff0c;无法打开&#xff0c;要移到废纸篓”问题解决步骤…...

【大数据架构】基于流式数据的大数据架构升级

背景 团队在升级大数据架构,摒弃了原来基于hadoop的架构,因此抛弃了hive,hdfs,mapreduce这一套,在讨论和摸索中使用了新的架构。 后端使用kafka流式数据通过rest catalog写入iceberg,存储于minio。在写入iceberg的时候,首先是写data数据文件,然后再写iceberg的metada…...

OpenCV中的圆形标靶检测——斑点检测算法(二)

前面的章节中我们已经大致介绍了算法流程,也对一些算法中用到的相关概念做了简要介绍,同时给出了算法调用的API,现在我们开始算法检测接口实现源码的分析。 1. 斑点的分组与加权 这里我们选择后者,先了解算法的处理流程,再分析各个模块的实现。算法流程图如下图所示,上一…...

网线制作(双绞线+水晶头)——T568B标准

参考视频&#xff1a;https://www.bilibili.com/video/BV1KQ4y1i7zP/ 1、使用剥线器 2、将线捋顺、排序、剪掉牵引线 记忆技巧 1.线序颜色整体是一浅一深 2.颜色顺序是黄、蓝、绿、棕 一个黄种人、从上向下看&#xff0c;分别看到的是蓝天、青草(绿)、泥土(棕色) 3.中间两根浅…...

湖南源点(市场研究咨询)如何产出更加有意义的竞品调研

湖南源点咨询认为&#xff1a;当前&#xff0c;任何项目都不能盲目开始&#xff0c;前期的准备工作必不可少。在基础架构搭建的同时&#xff0c;设计上对于前端功能、用户体验的调研就优先开始了。在这个阶段&#xff0c;大部分设计师都会分配很多调研任务&#xff0c;疯狂对竞…...

Qt/C++音视频开发76-获取本地有哪些摄像头名称/ffmpeg内置函数方式

一、前言 上一篇文章是写的用Qt的内置函数方式获取本地摄像头名称集合&#xff0c;但是有几个缺点&#xff0c;比如要求Qt5&#xff0c;或者至少要求安装了多媒体组件multimedia&#xff0c;如果没有安装呢&#xff0c;或者安装的是个空的呢&#xff0c;比如很多嵌入式板子&am…...

09 platfrom 设备驱动

platform 设备驱动,也叫做平台设备驱动。请各位重点学习! 1、驱动的分离与分层 1)驱动的分隔与分离 Linux 操作系统,代码的重用性非常重要。驱动程序占用了 Linux 内核代码量的大头,如果不对驱动程序加以管理,用不了多久 Linux 内核的文件数量就庞大到无法接受的地步。…...

【C#】C#读写Excel文件

1.工具库选择 使用EPPlus读取Excel文件&#xff0c;在visual studio2022中安装最新NuGet。 2.读文件测试 using OfficeOpenXml; using OfficeOpenXml.Packaging.Ionic.Zip; using OfficeOpenXml.Style; using System; using System.Collections.Generic; using System.IO; u…...

数据流图(DFD)绘制规范

软件数据流图&#xff08;Data Flow Diagram&#xff0c;DFD&#xff09;是一种重要的工具&#xff0c;用于表示系统中数据的流动和处理。DFD帮助开发团队和利益相关者理解系统的功能和数据处理过程。绘制DFD时应遵循一定的规范和步骤&#xff0c;以确保图表的清晰性和一致性。…...

有待挖掘的金矿:大模型的幻觉之境

人工智能正在迅速变得无处不在&#xff0c;在科学和学术研究中&#xff0c;自回归的大型语言模型&#xff08;LLM&#xff09;走在了前列。自从LLM的概念被整合到自然语言处理&#xff08;NLP&#xff09;的讨论中以来&#xff0c;LLM中的幻觉现象一直被广泛视为一个显著的社会…...

常见八大排序(纯C语言版)

目录 基本排序 一.冒泡排序 二.选择排序 三.插入排序 进阶排序&#xff08;递归实现&#xff09; 一.快排hoare排序 1.单趟排序 快排步凑 快排的优化 &#xff08;1&#xff09;三数取中 &#xff08;2&#xff09;小区间优化 二.前后指针法(递归实现) 三.快排的非…...

vue2学习(06)----vuex

目录 一、vuex概述 1.定义 优势&#xff1a; 2.构建环境步骤 3.state状态 4.使用数据 4.1通过store直接访问 4.2通过辅助函数 5.mutations修改数据&#xff08;同步操作&#xff09; 5.1定义 5.2步骤 5.2.1定义mutations对象&#xff0c;对象中存放修改state数据的方…...

webflux 拦截器验证token

在WebFlux中&#xff0c;我们可以使用拦截器&#xff08;Interceptor&#xff09;来验证Token。以下是一个简单的示例&#xff1a; 1. 首先&#xff0c;创建一个名为TokenInterceptor的类&#xff0c;实现HandlerInterceptor接口&#xff1a; java import org.springframewor…...

C++中的继承方式

目录 摘要 1. 公有继承&#xff08;Public Inheritance&#xff09; 2. 保护继承&#xff08;Protected Inheritance&#xff09; 3. 私有继承&#xff08;Private Inheritance&#xff09; 4. 多重继承&#xff08;Multiple Inheritance&#xff09; 继承列表的项数 摘要…...

Vue进阶之Vue无代码可视化项目(四)

Vue无代码可视化项目 左侧栏第一步LeftPanel.vueLayoutView.vuebase.css第二步LayoutView.vueLeftPanel.vue编排引擎smooth-dnd安装创建文件SmoothDndContainer.tsutils.tsSmoothDndDraggable.tsLeftPanel.vue左侧栏 第一步 创建LeftPanel LeftPanel.vue <script setup…...

day40--Redis(二)实战篇

实战篇Redis 开篇导读 亲爱的小伙伴们大家好&#xff0c;马上咱们就开始实战篇的内容了&#xff0c;相信通过本章的学习&#xff0c;小伙伴们就能理解各种redis的使用啦&#xff0c;接下来咱们来一起看看实战篇我们要学习一些什么样的内容 短信登录 这一块我们会使用redis共…...

使用Ollama+OpenWebUI本地部署Gemma谷歌AI开放大模型完整指南

&#x1f3e1;作者主页&#xff1a;点击&#xff01; &#x1f916;AI大模型部署与应用专栏&#xff1a;点击&#xff01; &#x1f916;Ollama部署LLM专栏&#xff1a;点击&#xff01; ⏰️创作时间&#xff1a;2024年6月4日10点50分 &#x1f004;️文章质量&#xff1…...

react的自定义组件

// 自定义组件(首字母必须大写) function Button() {return <button>click me</button>; } const Button1()>{return <button>click me1</button>; }// 使用组件 function App() {return (<div className"App">{/* // 自闭和引用自…...

海宁代理记账公司-专业的会计服务

随着中国经济的飞速发展&#xff0c;企业的规模和数量日益扩大&#xff0c;在这个过程中&#xff0c;如何保证企业的财务活动合规、准确无误地进行&#xff0c;成为了每个企业面临的重要问题&#xff0c;专业、可靠的代理记账公司应运而生。 海宁代理记账公司的主要职责就是为各…...

matlab 计算三维空间点到直线的距离

目录 一、算法原理二、代码实现三、结果展示四、参考链接本文由CSDN点云侠原创,原文链接。如果你不是在点云侠的博客中看到该文章,那么此处便是不要脸的爬虫与GPT。 一、算法原理 直线的点向式方程为: x − x 0 m = y...

最高级网站建设/百度企业官网

albert1017Linux下压缩某个文件夹&#xff08;文件夹打包&#xff09; tar -zcvf /home/xahot.tar.gz /xahottar -zcvf 打包后生成的文件名全路径 要打包的目录例子&#xff1a;把/xahot文件夹打包后生成一个/home/xahot.tar.gz的文件。 # tar -xf all.tar 这条命令是解出all.t…...

经典的java做网站/电商seo是什么

title: 刷题遇上的知识点 date: 2016-05-27 13:36:36 categories: C tags: - C 1 运算符号|&#xff08;按位取或运算&#xff09; 和&&#xff08;按位取与运算&#xff09;&#xff0c;逗号运算符 例题分析&#xff1a; 如果x2014&#xff0c;下面函数的返回值是&a…...

搜狗搜索网页版/厦门seo优化

1 引言 说到前端编译方案&#xff0c;也就是如何打包项目&#xff0c;如何编译组件&#xff0c;可选方案有很多&#xff0c;比如&#xff1a; 通过 webpack / parcel / gulp 构建项目。通过 parcel / gulp / babel 构建组件。如果你喜欢零配置的 parcel&#xff0c;那么项目和组…...

男科医院网站建设/2345网址导航应用

HTML 图像在 HTML 中&#xff0c;图像由 标签定义&#xff0c; 标签并不会在网页中插入图像,而是从网页上链接图像。实例Paoo教程 - 水乡景色尝试一下 在线实例插入图像本例演示如何在网页中显示图像。从不同的位置插入图片本例演示如何将其他文件夹或服务器的图片显示到网页中…...

ps怎么做网站页面/制作网页

阅读本文大概需要 2.8 分钟。来自&#xff1a;https://blog.csdn.net/xiaojimanman/article/details/18556703前几天&#xff0c;在其他网站上看到一个表情自动生成器&#xff0c;自己就试着做了一下&#xff0c;没想到还真给搞定了&#xff5e;目前&#xff0c;可以处理“臣妾…...

信阳专业做网站公司/怎么做百度关键词排名

一、赛题解读 1、赛题分析 赛题任务需要对添加了水印的图像&#xff0c;将水印擦除掉&#xff0c;还原原本的图的样子(图1)。 与手写文字擦除任务(图2)一个比较大的区别是&#xff1a;水印占据面积很大&#xff0c;因此对水印擦除后&#xff0c;还需要对被擦除的区域进行一个填…...