酷炫❤表白❤烟花

酷炫表白烟花



酷炫❤表白❤烟花_第1张图片
作品简介
该作品是运用到了前端开发的知识内容(JS内容),但是运用到了前段比较后面的知识了,该作品可以用做网页设计的背景是一个不错的选择,以上是该程序运行的效果图,HTML,CSS中多部分的运用与设置,就是单词的字面意思,JS的话可以不做太多的深入了解,有时只需会调用即可,看的懂即可,
类似这样的的表白相册比如:雪花下的告白

调用JS使用时,JS里面的内容不需要做过多的研究与了解,只需给你一个JS文件会调用即可,但是HTML,CSS的内容中的至少的单词要知道意思与会运用,以下是HTML部分中的代码(主要还是调用后缀为JS的文件里的内容)

网盘链接:https://pan.baidu.com/s/1eg88dg4PSwkWt1y4EshACg
提取码:tvj2



<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <link rel="stylesheet" href="css/style.css">
    <script id="jqbb" src="https://libs.baidu.com/jquery/1.11.1/jquery.min.js">script>
    <style>
        body{margin:0;padding:0;overflow: hidden;} .city{width:100%;position:fixed;bottom:
                0px;z-index: 100;} .city img{width: 100%;}
        audio{
            opacity: 0;
        }
    style>
    <title>
        炫酷烟花表白
    title>
    
    <link href="modal.css" rel="stylesheet"/>

    <style type="text/css">
        html,
        body {
            background-color: black;
            overflow: hidden;
            user-select: none;
            margin: 0;
        }
    style>
head>
<body onselectstart="return false">
    <div class="star comet">div>
    <script src="js/index.js">script>
  

<div class="share_img"><img src="img/xin.png" alt="">div>

<div class="page_one">
    <div class="content">
        <div class="text_wrapper">
            <img class="xin" src="img/xin.png" alt="" />
            <div class="text">
                小姐姐,我好喜欢你,你愿意做我女朋友吗?
            div>
        div>
    div>
    <div class="btn-groups">
        <div class="heart-btn">
            <div id="yes" class="btn btn-a"><span>愿意span>div>
        div>
        <div id="no" class="btn btn-b"><span>不愿意span>div>
    div>
div>

<canvas id='cas' style="background-color:rgba(0,5,24,1); z-index: 9999;">
    浏览器不支持canvas
canvas>
<div class="city">
    <img src="img/city.png" alt="" />
div>
<img src="img/moon.png" alt="" id="moon" style="visibility: hidden;" />
<div style="display:none">
    <div class="shape">
        520❤
    div>
    
        
       
    
    <div class="shape">
        茫茫人海
    div>
    <div class="shape">
        相遇是缘
    div>
    <div class="shape">
        我爱你直到永远
    div>
div>

<audio autoplay loop id="music">
    <source src="mp3/music.mp3" />
audio>
<iframe  id="iframMusic" allow="autoplay" style="display:none" src="mp3/blank.mp3">iframe>
<script src="jquery.min.js">script>
<script src="fire.js">script>
<script src="talk.js">script>





body>

html>

点个赞让我知道你来过哟!!!
点个赞让我知道你来过哟!!!
可以来我的界面看往期的博客!!!
如有什么需要可以私信
如有什么需要可以私信
如果有任何问题私信没有及时回复小伙伴们可以添加以下微信号咨询:
微信号:ych520cyy
或是qq:3364193252(尽量是qq,微信加多了我微信会被加过多,账号异常等问题
一般都会回复和指导大家的,祝所有小情侣都能天天快快乐乐的哟
酷炫❤表白❤烟花_第2张图片

你可能感兴趣的:(前端开发实践运用,表白小喜欢,js,css,html)