烟花爆炸特效

css代码请直接下载url

html

<div class="camera -x">
  <div class="camera -y">
    <div class="camera -z">
      <div class="fireworks">
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>
          </div>
        </div>
        <div class="line">
          <div class="spark">
            <div class="fire"></div>