H5+CSS3带方块消除游戏的404页面模板代码

特效代码 潘老师 3个月前 (12-10) 55 ℃ (0) 扫码查看



本文主要提供H5+CSS3开发的404 NOT FOUND错误页面模板代码下载,并且带有方块消除的小游戏,方便用户可以休闲一下。

效果

核心代码

<section class="huge-section fluid-container">
<div class="row">
  <div class="huge-side left-side col-xs-12 col-sm-6">
    <div class="row">
      <div class="huge-content col-xs-8 col-xs-offset-2">
        <a href="javascript:;">
          <img class="logo" src="static/picture/logo.png">
        </a>
        <h1>404</h1>
        <h2>The page you are looking for doesn't exist.</h2>
        <a class="btn" href="javascript:;">
          Go back to our Homepage
        </a>
        <footer>
          <!--Social Icons-->
          <ul class="social-icons">
            <li>
              <a href="javascript:;" class="social-icon">
                <i class="fa fa-facebook" aria-hidden="true"></i>
              </a>
            </li>
            <li>
              <a href="javascript:;" class="social-icon">
                <i class="fa fa-twitter" aria-hidden="true"></i>
              </a>
            </li>
            <li>
              <a href="javascript:;" class="social-icon">
                <i class="fa fa-pinterest-p" aria-hidden="true"></i>
              </a>
            </li>
            <li>
              <a href="javascript:;" class="social-icon">
                <i class="fa fa-instagram" aria-hidden="true"></i>
              </a>
            </li>
          </ul>
          <!--/Social Icons-->
        </footer>
      </div>
    </div>
  </div>
  <div class="huge-side right-side col-xs-12 col-sm-6">
    <div class="huge-background-img">
      <div id="container">
        <div id="game"></div>
        <div id="score">0</div>
        <div id="instructions">Click (or press the spacebar) to place the block</div>
        <div class="game-over">
          <h2>Game Over</h2>
          <p>You did great, you're the best.</p>
          <p>Click or spacebar to start again</p>
        </div>
        <div class="game-ready">
          <div id="start-button">Start</div>
          <div></div>
        </div>
      </div>
    </div>
  </div>
</div>
</section>

资源下载


版权声明:本站文章,如无说明,均为本站原创,转载请注明文章来源。如有侵权,请联系博主删除。
本文链接:https://www.panziye.com/project/tx/12378.html
喜欢 (0)
请潘老师喝杯Coffee吧!】
分享 (0)
用户头像
发表我的评论
取消评论
表情 贴图 签到 代码

Hi,您需要填写昵称和邮箱!

  • 昵称【必填】
  • 邮箱【必填】
  • 网址【可选】