css实现海底潜艇404错误动画页面代码-html代码-BFW代码库

css实现海底潜艇404错误动画页面代码

代码语言：html

代码描述：css实现海底潜艇404错误动画页面代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>404 Page not found</title>

    <!--  Stylesheets   -->
    <link href='//fonts.googleapis.com/css?family=Open+Sans:300,400,900' rel='stylesheet' type='text/css'>
    <style>
        /*********************************/
    /* Author  : Cavethemes
    /* Contact : cavethemes@gmail.com
    ---------------------------------
    ----- CONTENTS
    ---------------------------------
        | 1. CSS RESET
        | 2. BASIC CSS
        | 3. ANIMATED ELEMENTS
        |    a. WATER WAVES
        |    b. SUBMARINE
        |    c. SUBMARINE FAN
        |    d. SUBMARINE HEAD LIGHT
        |    e. BUBBLES
        | 4. ANIMATION KEYFRAMES
        | 5. MEDIA QUERIES
        | 6. LOADING CSS
        |
    ----------------------------------
    /*********************************/
    
    
    /***************************/
    /****- 1. CSS RESET -******/
    /*************************/
    
    *{
        margin: 0;
        padding: 0;
        border: 0;
        box-sizing: 0;
    }
    
    /***************************/
    /****- 2. BASIC CSS -******/
    /*************************/
    
    body{
        background: #617492;
        overflow: hidden;
    }
    
    
    .error{
        padding: 0px;
        margin-top: 60px;
        z-index: 9999;
    }
    .error h1{
        font-family: 'Open Sans', sans-serif;
        color: #8699b7;
        text-align: center;
        font-weight: 900;
        font-size: 3em;
        opacity: 1;
    }
    .error p{
        text-align: center;
        font-family: 'Open Sans', sans-serif;
        color: #8699b7;
        padding: 15px;
    }
    #submarine_container{
        position: absolute; 
        height: 100%; 
        width: 100%; 
        left: 0; 
        top: 0;
        fill:red;
       
    }
    #waves{
      position: absolute;
      width: 100%;
      bottom: 0;
    
    }
.........完整代码请登录后点击上方下载按钮下载查看