HTML静态网页成品作业(HTML+CSS)—— 非遗皮影戏介绍网页(6个页面)

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

文章目录

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


一、作品介绍

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

二、作品演示

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

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><title>皮影戏</title><link rel="stylesheet" href="./css/style.css">
</head>
<body><div class="ww"><div class="tt"><img src="./images/t.jpg" alt=""></div><div class="nn"><a href="index.html">网站首页</a><a href="qiyuan.html">历史起源</a><a href="liupai.html">艺术流派</a><a href="zhizuo.html">皮影制作</a><a href="chuancheng.html">传承发展</a><a href="tupian.html">精美图片</a></div><div class="cc"><div class="cc1"><div class="cc1-z"><div class="tit">皮影戏</div><div class="cc1-d">皮影戏(Shadow Puppets),又称“影子戏”或“灯影戏”,是一种以兽皮或纸板做成的人物剪影以表演故事的民间戏剧。表演时,艺人们在白色幕布后面,一边操纵影人,一边用当地流行的曲调讲述故事,同时配以打击乐器和弦乐,有浓厚的乡土气息。其流行范围极为广泛,并因各地所演的声腔不同而形成多种多样的皮影戏。<br>皮影戏是中国民间古老的传统艺术,老北京人都叫它“驴皮影”。据史书记载,皮影戏始于西汉,兴于唐朝,盛于清代,元代时期传至西亚和欧洲,可谓历史悠久,源远流长。<br>2011年,中国皮影戏入选人类非物质文化遗产代表作名录。</div></div><div class="cc1-y"><div class="tit">表演形式</div><div class="cc1-d">皮影戏,旧称“影子戏”或“灯影戏”,是一种用蜡烛或燃烧的酒精等光源照射兽皮或纸板做成的人物剪影以表演故事的民间戏剧。表演时,艺人们在白色幕布后面,一边操纵戏曲人物,一边用当地流行的曲调唱述故事(有时用方言),同时配以打击乐器和弦乐,有浓厚的乡土气息。在河南、山西、陕西、甘肃天水等地农村,这种拙朴的汉族民间艺术形式很受人们的欢迎。</div></div></div><div class="cc2"><div class="tit">皮影展示</div><div class="cc2-t"><img src="./images/1.jpeg" alt=""><img src="./images/2.jpeg" alt=""></div><div class="cc2-t"><img src="./images/3.jpeg" alt=""><img src="./images/4.jpg" alt=""></div></div></div><div class="ff">皮影戏 版权所有</div></div>
</body>
</html>

五、源码获取

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

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

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

相关文章

C++day5

思维导图 搭建一个货币的场景&#xff0c;创建一个名为 RMB 的类&#xff0c;该类具有整型私有成员变量 yuan&#xff08;元&#xff09;、jiao&#xff08;角&#xff09;和 fen&#xff08;分&#xff09;&#xff0c;并且具有以下功能&#xff1a; (1)重载算术运算符 和 -…

SQL 窗口函数

1.窗口函数之排序函数 RANK, DENSE_RANK, ROW_NUMBER RANK函数 计算排序时,如果存在相同位次的记录,则会跳过之后的位次 有 3 条记录排在第 1 位时: 1 位、1 位、1 位、4 位…DENSE_RANK函数 同样是计算排序,即使存在相同位次的记录,也不会跳过之后的位次 有 3 条记录排在…

bfs+枚举,CF666B - World Tour

一、题目 1、题目描述 2、输入输出 2.1输入 2.2输出 3、原题链接 Problem - 666B - Codeforces 二、解题报告 1、思路分析 数据量允许跑N次bfs预处理所有点的最短路&#xff0c;以及预处理到达每个点距离最远的3个点&#xff0c;以及每个点能够到达的最远的3个点 我们枚举…

独立游戏《星尘异变》UE5 C++程序开发日志4——实现任务系统

本游戏作为工厂游戏&#xff0c;任务系统的主要功能就是给玩家生产的目标和动力&#xff0c;也就是给玩家发布一个需要一定数量某星尘的订单&#xff0c;玩家提交需要的星尘后会获得奖励&#xff0c;游戏中实际的奖励机制略微有点复杂&#xff0c;这里直接简化为完成任务后就能…

【StableDiffusion】Lora 底层原理,低秩适配,Lora 如何与 checkpoint 联合发挥作用

鸣谢UP主&#xff1a;是花子呀 本篇博客参考视频&#xff1a;https://www.bilibili.com/video/BV17i421X7q7/?spm_id_from333.880.my_history.page.click&vd_source38d6ea3466db371e6c07c24eed03219b Lora 是个啥&#xff1f;Lora 的 缩写 Lora&#xff1a;Low Rank Ada…

day35| 860.柠檬水找零 406.根据身高重建队列 452. 用最少数量的箭引爆气球

文章目录 前言860.柠檬水找零思路方法一 406.根据身高重建队列思路方法一 452. 用最少数量的箭引爆气球思路方法一 总结 前言 860.柠檬水找零 思路 很简单&#xff0c;贪心只有一个&#xff0c;如果20优先用105找零&#xff0c;因为5更加万能一些 方法一 class Solution(ob…

R语言统计分析——图形文本、自定义坐标轴和图例

参考资料&#xff1a;R语言实战【第2版】 我们可以在图形上添加标题&#xff08;main&#xff09;、副标题&#xff08;sub&#xff09;、坐标轴标签&#xff08;xlab、ylab&#xff09;并指定标轴范围&#xff08;xlim、ylim&#xff09;。 # 录入数据 dose<-c(20,30,40,4…

快捷键专栏 IDEA、Navicat、电脑、Excle、Word等

标题 电脑篇windowsR 配合以下常用命令连上公司网线WiFi速度变慢问题解决Windows10 设置鼠标右键在此处打开cmd和Powershell窗口、关机打开电脑诊断工具系统设置常用设置查看电脑出场日期 systeminfo删除文件显示已在另一个程序打开&#xff1f;找回回收站删除的文件WindowsR输…

从sub-VP SDE形式推导出扰动核(高斯分布)的均值和方差【论文精读】

从sub-VP SDE形式推导出扰动核&#xff08;高斯分布&#xff09;的均值和方差【论文精读】 讲解视频 B站视频&#xff1a;sub-VP SDE形式推导出扰动核&#xff08;高斯分布&#xff09;的均值和方差 讲解目录 &#xff08;0&#xff09;sub-VP SDE形式由来&#xff1a;有良…

桌面应用开发框架比较:Electron、Flutter、Tauri、React Native 与 Qt

在当今快速发展的技术环境中&#xff0c;对跨平台桌面应用程序的需求正在不断激增。 开发人员面临着选择正确框架之挑战&#xff0c;以便可以高效构建可在 Windows、macOS 和 Linux 上无缝运行的应用程序。 在本文中&#xff0c;我们将比较五种流行的桌面应用程序开发框架&…

Ajax 快速入门

Ajax 概念&#xff1a;Ajax是一种Web开发技术&#xff0c;允许在不重新加载整个页面的情况下&#xff0c;与服务器交换数据并更新网页的部分内容。 作用&#xff1a; 数据交换&#xff1a;Ajax允许通过JavaScript向服务器发送请求&#xff0c;并能够接收服务器响应的数据。 异…

【人工智能】第五部分:ChatGPT的实际应用案例和未来发展方向

人不走空 &#x1f308;个人主页&#xff1a;人不走空 &#x1f496;系列专栏&#xff1a;算法专题 ⏰诗词歌赋&#xff1a;斯是陋室&#xff0c;惟吾德馨 目录 &#x1f308;个人主页&#xff1a;人不走空 &#x1f496;系列专栏&#xff1a;算法专题 ⏰诗词歌…

Ecovadis审核的内容

Ecovadis审核的内容。Ecovadis是一家国际性的企业社会责任评估机构&#xff0c;旨在为全球供应链的可持续性发展提供评估和审核。在本文中&#xff0c;我们将从以下几个方面详细介绍Ecovadis审核的内容&#xff1a; 一、Ecovadis审核的范围和目的 Ecovadis审核的范围涵盖了各个…

Halcon 多相机统一坐标系

小杨说事-基于Halcon的多相机坐标系统一原理个人理解_多相机标定统一坐标系-CSDN博客 一、概述 最近在搞多相机标定等的相关问题&#xff0c;对于很大的场景&#xff0c;单个相机的视野是不够的&#xff0c;就必须要统一到一个坐标系下&#xff0c;因此我也用了4个相机&#…

IDEA配置mybatis-config.xml模板文件

IDEA配置mybatis-config.xml模板文件 File>>Settings>>File and Code Templates 创建mybatis-config.xml模板 模板内容取自mybatis官网 mybatis官网 <?xml version"1.0" encoding"UTF-8" ?> <!DOCTYPE configurationPUBLIC &qu…

理解数学概念——线性(线性性)

1. 线性相关词汇的词源 1.1 单词“line”的词源 这个单词是古英语“line”和古法语“ligne”二者的融合。在古英语中&#xff0c;“line”的词义为“缆绳&#xff0c;绳索&#xff1b;一系列&#xff0c;行&#xff0c;字母行&#xff1b;规则&#xff0c;方向(cable, rope; s…

TextCtrl输入文本类

自学python如何成为大佬(目录):https://blog.csdn.net/weixin_67859959/article/details/139049996?spm1001.2014.3001.5501 wx.StaticText类只能够用于显示纯粹的静态文本&#xff0c;但是有时需要输入文本与用户进行交互&#xff0c;此时&#xff0c;就需要使用wx.TextCtrl…

什么是校园抄表系统?

1.校园抄表系统的简述 校园抄表系统是当代高校管理中的一个重要组成部分&#xff0c;主要运用于全自动搜集、管理方法与分析校园里的电力能源使用数据&#xff0c;如水电煤等。它通过先进的方式方法&#xff0c;完成了对能源消耗的实时监控系统&#xff0c;提升了电力能源管理…

GoogleDeepMind联合发布医学领域大语言模型论文技术讲解

Towards Expert-Level Medical Question Answering with Large Language Mod 这是一篇由Google Research和DeepMind合作发表的论文,题为"Towards Expert-Level Medical Question Answering with Large Language Models"。 我先整体介绍下这篇论文的主要内容&#x…

CCNA 0基础入门

OSI & TCP/IP OSI参考模型 TCP/IP协议 应用层 ------↓表示层 ------>应用层会话层 ------↑传输层 ------>传输层网络层 ------>网络互联层链路层 ------>网络接口层物理层 ------>↑ 物理层 传输的信号以及网线以及接线 主要作用是产生并检测电…