七夕节快乐--来自于程序员的表达

简介: 七夕节快乐--来自于程序员的表达

 记录一起走过的那些日子

讲述和亲爱的TA一起经历的那些故事

    • 那些初见印象
    • 那些浪漫的开始
    • 那些铭记于心的大小事
    • 那些经历的曲折
    • 那些经历的幸福与快乐
    • 那些珍贵的瞬间
    • 那些对未来的期许/计划

    创意代码表白

    以程序员的方式撒狗粮,专业浪漫,值得拥有!

    html:

    <!DOCTYPE html>
    <html>
    <head lang="en">
        <meta charset="UTF-8">
        <title>自取标题</title>
        <style type="text/css">
            *{padding: 0;
            margin: 0;}
            body,html{height:100%;}
            body{background-image: url("images/beijing.jpg");background-size: 100% 100%;}
            #box{width: 280px;
                height: 400px;
                position: fixed;
                left: 0;
                right: 0;
                top:0;
                bottom: 0;
                margin: auto;
                transform-style: preserve-3d;
                transform: rotateX(0deg) rotateY(0deg);
                animation: go 45s linear infinite;
               }
            #box img{width: 280px;
                     height: 400px;
                     position: absolute;
                     left: 0;
                     top: 0;
            }
            #box img:nth-child(1){
                transform: rotateY(0deg) translateZ(650px);text-rendering: auto;}
            #box img:nth-child(2){
                transform: rotateY(36deg) translateZ(650px);text-rendering: auto;}
            #box img:nth-child(3){
                transform: rotateY(72deg) translateZ(650px);text-rendering: auto;}
            #box img:nth-child(4){
                transform: rotateY(108deg) translateZ(650px);text-rendering: auto;}
            #box img:nth-child(5){
                transform: rotateY(144deg) translateZ(650px);text-rendering: auto;}
            #box img:nth-child(6){
                transform: rotateY(180deg) translateZ(650px);text-rendering: auto;}
            #box img:nth-child(7){
                transform: rotateY(216deg) translateZ(650px);text-rendering: auto;}
            #box img:nth-child(8){
                transform: rotateY(252deg) translateZ(650px);text-rendering: auto;}
            #box img:nth-child(9){
                transform: rotateY(288deg) translateZ(650px);text-rendering: auto;}
            #box img:nth-child(10){
                transform: rotateY(324deg) translateZ(650px);text-rendering: auto;}
        @keyframes go {
            0%{transform: rotateX(0deg) rotateY(0deg);}
            25%{transform: rotateX(20deg) rotateY(180deg);}
            50%{transform: rotateX(0deg) rotateY(360deg);}
            75%{transform: rotateX(-20deg) rotateY(540deg);}
            100%{transform: rotateX(0deg) rotateY(720deg);}
        }
        </style>
    </head>
      <body>
        <div id="box">
                    自己更换图片
            <img src="images/1.jpg" alt="总想把世界上最好的都给你,却发现世界最好的就是你。" title="爱你呢"/>
            <img src="images/2.jpg" alt="你陪着我的时候,我从没羡慕过任何人。" title="爱你呢"/>
            <img src="images/3.jpg" alt="遇到你,是我一生的缘分;牵着你,是我一生的快乐;爱上你,是我一生的幸运。今生有你相伴,是我一生的幸福。" title="爱你呢"/>
            <img src="images/4.jpg" alt="总想把世界上最好的都给你,却发现世界最好的就是你。" title="爱你呢"/>
            <img src="images/5.jpg" alt="总想把世界上最好的都给你,却发现世界最好的就是你。" title="爱你呢"/>
            <img src="images/6.jpg" alt="总想把世界上最好的都给你,却发现世界最好的就是你。" title="爱你呢"/>
            <img src="images/7.jpg" alt="总想把世界上最好的都给你,却发现世界最好的就是你。" title="爱你呢"/>
            <img src="images/8.jpg" alt="总想把世界上最好的都给你,却发现世界最好的就是你。" title="爱你呢"/>
            <img src="images/9.jpg" alt="总想把世界上最好的都给你,却发现世界最好的就是你。" title="爱你呢"/>
            <img src="images/10.jpg" alt="总想把世界上最好的都给你,却发现世界最好的就是你。" title="爱你呢"/>
        </div>
            <div class="hovertree"></div>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.fireworks.js"></script>
    <script type="text/javascript">
        $('.hovertree').fireworks({
          sound: true, // sound effect
          opacity: 0.3, 
          width: '100%', 
          height: '100%' 
        });
    </script>
      </body>
    </html>

    image.gif


    目录
    打赏
    0
    0
    0
    0
    927
    分享
    相关文章
    探索编程之美:从代码到艺术
    【9月更文挑战第34天】本文旨在通过技术感悟,揭示编程不仅仅是冷冰冰的代码,它更像是一种艺术形式。我们将一起走进编程的世界,感受其内在的美,并通过实际例子展示如何将这种美转化为解决问题的工具。文章不提供具体代码示例,而是聚焦于对编程美学的思考与认识。
    编程之美:从代码到艺术
    【10月更文挑战第42天】在数字世界的画布上,代码不仅仅是冷冰冰的指令序列,它如同艺术家手中的笔触,能够创作出令人惊叹的作品。本文旨在探索编程的艺术性,揭示如何通过技术实现创意和解决问题的美学。我们将一起走进代码的世界,感受它的结构之美、逻辑之精和创新之力。
    80 4
    探索编程之美:从代码到艺术的转变
    【10月更文挑战第30天】在数字世界中,代码是构建一切的基石。本文将通过一次个人的技术感悟之旅,探讨如何将冷冰冰的代码转变为温暖人心的艺术。我们将一起走进编程的世界,了解它如何影响我们的生活和工作,并揭示那些隐藏在代码背后的故事。让我们抛开复杂的技术术语,以简单直白的语言,一起感受编程的魅力。
    |
    4月前
    |
    代码与生活:技术感悟中的哲理
    【10月更文挑战第20天】 在编程的世界里,我们不仅仅是在编写代码,更是在塑造一种生活方式。本文将探讨如何将编程思维应用到日常生活中,以及这种思维方式如何帮助我们更好地理解世界和自己。通过具体的例子和深入的分析,我们将看到,编程不仅仅是一种技能,更是一种生活哲学。
    50 0
    探索编程之美:从代码中寻找艺术
    【9月更文挑战第16天】在数字的世界中,编程不仅仅是冷冰冰的逻辑与算法。它如同绘画、雕塑或音乐一样,拥有其独特的美学。本文将带你领略编程的艺术性,从简单的代码示例出发,深入探讨代码结构、设计模式以及编程思维中的美。通过这些视角,我们不仅能够提升代码的效率和可读性,还能在日常的编程实践中发现更多的乐趣和创造性。
    从代码中感悟生活的哲理
    【9月更文挑战第12天】本文以编程为引子,探讨了技术背后的哲学思考。文章通过深入浅出的方式,结合生活中的小故事和简单的代码示例,引导读者理解在看似冰冷的代码背后所蕴含的热情与智慧。文章旨在启发读者,无论面对何种挑战,都应保持初心,勇于探索,不断学习,最终找到属于自己的人生方向。
    编程之美:从代码到艺术的转变
    【9月更文挑战第17天】在技术的世界里,代码不仅仅是冷冰冰的指令序列,它同样可以是流动的艺术。本文将带你走进编程的内在世界,探索如何通过代码实现功能与美学的完美结合。我们将一起见证一个简单功能的实现,是如何一步步转化为令人赏心悦目的艺术作品,同时不忘提升其背后的技术深度和实用性。
    探索代码的诗意——我的编程感悟
    【5月更文挑战第31天】在数字世界的浩瀚海洋中,我是一位航行者。每一次按下键盘,都是与机器灵魂的对话。这篇文章是我个人的技术之旅,记录了从困惑到顿悟的过程,以及那些让我着迷的编程之美。它不仅仅是关于技术的,更是关于创造和表达的艺术。
    搞不懂缺省路由?一个故事告诉你
    搞不懂缺省路由?一个故事告诉你
    147 1
    AI助理

    你好,我是AI助理

    可以解答问题、推荐解决方案等