html+圣诞树

news2024/10/7 12:25:28

圣诞节

基督教纪念耶稣诞生的重要节日。亦称耶稣圣诞节、主降生节,天主教亦称耶稣圣诞瞻礼。耶稣诞生的日期,《圣经》并无记载。公元336年罗马教会开始在12月25日过此节。12月25日原是罗马帝国规定的太阳神诞辰。有人认为选择这天庆祝圣诞,是因为基督教徒认为耶稣就是正义、永恒的太阳。5世纪中叶以后,圣诞节作为重要节日,成了教会的传统,并在东西派教会中逐渐传开。因所用历法不同等原因,各教派会举行庆祝的具体日期和活动形式也有差别。圣诞节习俗传播到亚洲主要是在十九世纪中叶,日本、韩国等都受到了圣诞文化的影响。现在西方在圣诞节常互赠礼物,举行欢宴,并以圣诞老人、圣诞树等增添节日气氛,已成为普遍习俗。圣诞节也成为西方世界以及其他很多地区的公共假日。

圣诞过完就是元旦,马上就要过年拉,祝大家在新的一年顺风顺水,在技术的学习道路上畅通无阻。

圣诞树的由来

据说圣诞树 [2]  最早出现在古罗马12月中旬的农神节,德国传教士尼古斯在公元8世纪用枞树供奉圣婴。随后,德国人把12月24日作为亚当和夏娃的节日,在家放上象征伊甸园的“乐园树”,上挂代表圣饼的小甜饼,象征赎罪;还点上蜡烛和球,象征基督。到16世纪,宗教改革者马丁·路德,为求得一个满天星斗的圣诞之夜,设计出在家中布置一颗装着蜡烛和球的圣诞树。

18世纪,开始在德国信义宗信徒流行,19世纪流行与德国全国,成为德国根深蒂固的传统。

19世纪初期,圣诞树传到英国;

圣诞树风俗(4张)

19世纪中叶,艾伯特(维多利亚女王的丈夫、德国皇子)加以推广普及。维多利亚式圣诞树饰以蜡烛、糖果和花色糕点,用 [2]  丝带和纸链吊挂在树枝上。

早在17世纪圣诞树即由德国移民带到北美,至19世纪广为流行。在奥地利、瑞士、波兰和荷兰也颇流行。

在中国和日本,圣诞树于19及20世纪由美国传教士传入,多饰以彩色缤纷的纸花。

 圣诞树代码

送你一颗聚满礼物的圣诞树,顶上最亮的那颗星是我的真心,下面挂的是我的痴心,制造材料的是我一颗不变有心:圣诞快乐

 一个HTML的圣诞树,我也来水一个圣诞勋章,直接创建一个html,将下面代码复制进去

 

 

 

 

<!DOCTYPE  PUBLIC>
<html>
<head>
  <meta charset="utf-8">
  <title>
    From ZXW-NUDT
  </title>
  <style>
    body{text-align:center}
    html, body
    {
      width: 100%;
      height: 100%;
      margin: 0;
      padding: 0;
      border: 0;
    }
 
    div
    {
      margin: 0;
      padding: 0;
      border: 0;
    }
 
    .nav
    {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 27px;
      background-color: white;
      color: black;
      text-align: center;
      line-height: 25px;
    }
 
    a
    {
      color: black;
      text-decoration: none;
      border-bottom: 1px dashed black;
    }
 
    a:hover
    {
      border-bottom: 1px solid red;
    }
 
    .previous
    {
      float: left;
      margin-left: 10px;
    }
 
    .next
    {
      float: right;
      margin-right: 10px;
    }
 
    .green
    {
      color: green;
    }
 
    .red
    {
      color: red;
    }
 
    textarea
    {
      width: 100%;
      height: 100%;
      border: 0;
      padding: 0;
      margin: 0;
      padding-bottom: 20px;
    }
 
    .block-outer
    {
      float: left;
      width: 22%;
      height: 100%;
      padding: 5px;
      border-left: 1px solid black;
      margin: 30px 3px 3px 3px;
    }
 
    .block-inner
    {
      height: 68%;
    }
 
    .one
    {
      border: 0;
    }
  </style>
</head>
 
<body marginwidth="0" marginheight="0">
<canvas id="c" height="356" width="446">
  <script>
    var collapsed = true;
    function toggle()
    {
      var fs = top.document.getElementsByTagName('frameset')[0];
      var f = fs.getElementsByTagName('frame');
      if (collapsed)
      {
        fs.rows = '250px,*';
        fs.noResize = false;
        f[0].noResize = false;
        f[1].noResize = false;
      }
 
      else
      {
        fs.rows = '30px,*';
        fs.noResize = true;
        f[0].noResize = true;
        f[1].noResize = true;
      }
      collapsed = !collapsed;
    }
  </script>
 
  <script>
    var b = document.body;
    var c = document.getElementsByTagName('canvas')[0];
    var a = c.getContext('2d');
    document.body.clientWidth;
  </script>
 
  <script>
    M=Math;
    Q=M.random;J=[];
    U=16;
    T=M.sin;
    E=M.sqrt;
    for(O=k=0;x=z=j=i=k<200;)
      with(M[k]=k?c.cloneNode(0):c)
      {
        width=height=k?32:W=446;
        with(getContext('2d'))
          if(k>10|!k)
 
            for(
                    font='60px Impact',
                            V='rgba(';I=i*U,fillStyle=k?k==13?V+'205,205,215,.15)':
                    V+(147+I)+','+(k%2?128+I:0)+','+I+',.5)':'#cca',i<7;)
 
              beginPath(fill(arc(U-i/3,24-i/2,k==13?4-(i++)/2:8-i++,0,M.PI*2,1)));
 
          else for(;
                  x=T(i),
                          y=Q()*2-1,
                          D=x*x+y*y,
                          B=E(D-x/.9-1.5*y+1),
                          R=67*(B+1)*(L=k/9+.8)>>1,
                  i++<W;
          )
 
            if(D<1)
              beginPath(strokeStyle=V+R+','+(R+B*L>>0)+',40,.1)'),
                      moveTo(U+x*8,U+y*8),
                      lineTo(U+x*U,U+y*U),
                      stroke();
 
        for(
                y=H=k+E(k++)*25,
                        R=Q()*W;
                P=3,j<H;)
          J[O++]=[
            x+=T(R)*P+Q()*6-3,y+=Q()*U-8,
            z+=T(R-11)*P+Q()*6-3,
            j/H*20+((j+=U)>H&Q()>.8?Q(P=9)*4:0)>>1]
      }
 
    setInterval(function G(m,l)
    {
      A=T(D-11);
      if(l)
 
        return(
                m[2]-l[2])*A+(l[0]-m[0])*T(D);
      a.clearRect(0,0,W,W);
      J.sort(G);
 
      for(
              i=0;
              L=J[i++];
              a.drawImage(M[L[3]+1],207+L[0]*A+L[2]*T(D)>>0,L[1]>>1))
      {
        if(i==2e3)
          a.fillText
          ('Happy Christmas!',U,345);
 
        if(!(i%7))
          a.drawImage(M[13],
                  ((157*(i*i)+T(D*5+i*i)*5)%W)>>0,
                  ((113*i+(D*i)/60)%(290+i/99))>>0);
      }
      D+=.02
    },1)
  </script>
</canvas>
</body>
</html>

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

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

相关文章

【学习打卡07】 可解释机器学习笔记之Shape+Lime代码实战

可解释机器学习笔记之ShapeLime代码实战 文章目录可解释机器学习笔记之ShapeLime代码实战基于Shapley值的可解释性分析使用Pytorch对MNIST分类可解释性分析使用shap的Deep Explainer进行可视化使用Pytorch对预训练ImageNet图像分类可解释性分析指定单个预测类别指定多个预测类别…

Elasticsearch 核心技术(一):Elasticsearch 安装、配置、运行(Windows 版)

❤️ 个人主页&#xff1a;水滴技术 &#x1f680; 支持水滴&#xff1a;点赞&#x1f44d; 收藏⭐ 留言&#x1f4ac; &#x1f338; 订阅专栏&#xff1a;大数据核心技术从入门到精通 文章目录一、Elasticsearch 版本的选择二、下载 **Elasticsearch**三、安装 Elasticsear…

Springboot+Netty实现基于天翼物联网平台CTWing(AIOT)终端TCP协议(透传模式)-云服务端(IOT平台)

之前有文章用java实现了设备端和应用订阅端&#xff0c;那么我根据AIOT的协议也可以实现一个demo物联网平台端&#xff0c;这种简易的平台是实现自己搭建物联网平台的基础。 直接用代码 新建Springboot的maven项目&#xff0c;pom.xml文件导入依赖包&#xff08;用到了swagge…

UDP协议在Windows上使用示例

UDP(User Datagram Protocol&#xff0c;用户数据报协议)是无连接的&#xff0c;因此在两个进程通信前没有握手过程。UDP协议提供一种不可靠数据传送服务&#xff0c;也就是说&#xff0c;当进程将一个报文发送进UDP套接字时&#xff0c;UDP协议并不保证该报文将到达接收进程。…

过孔基础常识

过孔&#xff0c;一个绝大多数硬件工程师都听说过&#xff0c;但又并非真正了解的名词。了解的都知道&#xff0c;其在PCB板中其着至关重要的的作用。没有过孔的存在&#xff0c;很难画出一块完美的PCB板。所以呢&#xff0c;小编今日就带大家了解了解什么是过孔。 什么是过孔…

FCN代码及效果展示

1. 代码获取 代码地址: https://github.com/Le0v1n/ml_code/tree/main/Segmentation/FCN 2. 从头开始训练 2.1 测试平台 GPU&#xff1a;NVIDIA RTX 3070CPU: Intel I5-10400FRAM: 16GBOS: Windows 11Dataset: VOC2012Class num: 21(201)Batch size: 4Learning Rate: 0.1Ep…

嘉兴经开区第四届创新创业大赛总决赛成功举办

12月21日至12月22日&#xff0c;嘉兴经济技术开发区第四届创新创业大赛总决赛成功举办&#xff0c;经过激烈角逐最后共有10家企业分别获得大赛初创组和成长组的一二三等奖。 总决赛现场 嘉兴经开区第四届中国创新创业大赛于6月正式启动&#xff0c;陆续在嘉兴、成都、北京、西…

【详细学习SpringBoot源码之内嵌Tomcat启动原理分析编译部署Tomcat源码过程解析-9】

一.知识回顾 【0.SpringBoot专栏的相关文章都在这里哟&#xff0c;后续更多的文章内容可以点击查看】 【1.SpringBoot初识之Spring注解发展流程以及常用的Spring和SpringBoot注解】 【2.SpringBoot自动装配之SPI机制&SPI案例实操学习&SPI机制核心源码学习】 【3.详细学…

12-RabbitMq概述与工作模式深度剖析

MQ概述 MQ全称 Message Queue&#xff08;消息队列&#xff09;&#xff0c;是在消息的传输过程中保存消息的容器。多用于分布式系统之间进行通信。 MQ 的优势 应用解耦&#xff1a;提高系统容错性和可维护性 异步提速&#xff1a;提升用户体验和系统吞吐量 削峰填谷&#xff1…

unity中使用代码接绘制三维模型

一 模型的构成 在三维世界中&#xff0c;绘制一个模型并不是什么很复杂的问题。只要知道了基本原理一切需求便迎刃而解。 如下图所示&#xff0c;任何模型都是由点线面构成的&#xff0c;而面的最小单位是三角形。 任何一个多边形的面&#xff0c;都是由多个三角形构成的。比…

Web前端105天-day64-HTML5_CORE

HTML5CORE04 目录 前言 一、复习 二、WebSocket 三、服务器搭建 四、聊天室 五、defineProperty 5.1.初识defineProperty 5.2.配置多个属性 5.3.可配置 5.4.赋值监听 5.5.练习 5.6.计算属性 总结 前言 HTML5CORE04学习开始 一、复习 SVG: 利用HTML的 DOM 来绘制图…

PCB贴片机如何送料?

1.常见的贴片机供料器四种形式 http://www.sz-bjzn.com/1547.html 2.模块化设计SMT贴片机送料器的操作方法 3.淘宝 https://item.taobao.com/item.htm?spma230r.1.14.98.33e41823OZ1zzn&id579043582781&ns1&abbucket20#detail 不错&#xff1a;https://item.tao…

distinct与group by 去重

distinct与group by 去重distinct 特点&#xff1a;group by 特点&#xff1a;总结&#xff1a;mysql中常用去重复数据的方法是使用 distinct 或者group by &#xff0c;以上2种均能实现&#xff0c;但也有不同的地方。distinct 特点&#xff1a; 1、distinct 只能放在查询字段…

重新更新anaconda

更新anaconda问题阐述问题分析打开Anaconda Nvaigator打开文件所在位置复制文件所在路径找到此电脑或者打开设置找到高级系统设置环境变量添加环境变量打开scripts文件修改成功再一次启动感谢观看今天手贱,不小心删掉的anaconda,我想一不做二不休,直接重新重装了,就找到了anaco…

经典SQL语句大全(基础、提升、技巧、数据开发、基本函数)

目录 前言 正文 第一章&#xff1a;基础 第二章&#xff1a;提升 第三章&#xff1a;技巧 第四章&#xff1a;数据开发-经典​​​​​​​ 第五章&#xff1a;SQL Server基本函数 第六章&#xff1a;常识 第七章&#xff1a;SQLServer2000 同步复制技术实现步骤 总结…

juc-4-synchronized原理

目录 1、synchronized 作用于静态方法 总结 ​编辑 案例 静态成员变量 (synchronized锁非静态方法) 案例 静态成员变量 (synchronized锁静态方法 或 直接锁类) 2、监视器锁(monitor) 2.1 synchronized怎么实现的线程安全呢&#xff1f; 3、JDK6 synchronized 的优化 3.1 C…

互联网技术不再是统领,当下正在发生着一场深刻的变革

拥抱实体经济&#xff0c;绝对是当下互联网玩家们的首要选择。无论是头部的互联网企业来讲&#xff0c;还是新生的互联网玩家而言&#xff0c;它们都不约而同地将关注的焦点聚焦在了这样一个方向上。   透过这一点&#xff0c;我们可以非常明显地感受到&#xff0c;一个全新的…

圣诞节,记录前行中跨过的2022

2022年&#xff0c;我人生的第二十四年&#xff0c;是我大学生活的最后一年&#xff0c;是我职场生涯的第一年&#xff0c;这一年从学生到打工人&#xff0c;从实习生到职场员工&#xff0c;变化了许多&#xff0c;做了许多&#xff0c;收获了许多&#xff0c;同时也成长了许多…

m自适应FSK解调系统误码率matlab仿真

目录 1.算法描述 2.仿真效果预览 3.MATLAB核心程序 4.完整MATLAB 1.算法描述 FSK信号的解调也有非相干和相干两种&#xff0c;FSK信号可以看作是用两个频率源交替传输得到的&#xff0c;所以FSK的接收机由两个并联的ASK接收机组成。 (1)相干解调 相干解调是利用乘法器&…

Minecraft(我的世界) Fabric 1.19.3 服务器搭建教程

Debian系统使用MCSManager9面板搭建MC Java版MOD服务器的教程&#xff0c;本教程用的Fabric1.19.3服务端&#xff0c;用其他服务端的也可以参考一下。 视频教程&#xff1a;https://www.bilibili.com/video/BV1Zd4y1h7zG/ 我的世界(MC) Fabric 1.19.3 开服教程&#xff0c;新手…