css3彩色试管液体流动ui特效代码下载


css3彩色试管液体流动ui特效代码下载
css3彩色试管液体流动ui特效代码下载以及彩色试管、液体流动ui等js/jquery网页特效代码下载。

1. 引入CSS

<link rel="stylesheet" href="css/style.css">

2. HTML代码

  <h1>Birthstone</h1>
  <div class="container">
    <div class="bottle">
      <div class="shadow a"></div>
      <div class="box a">Garnet&emsp;&emsp;
        <div class="bobble"></div>
        <h2>1</h2>
      </div>
    </div>
    <div class="bottle">
      <div class="shadow b"></div>
      <div class="box b">Amethyst&emsp;&emsp;
        <div class="bobble"></div>
        <h2>2</h2>
      </div>
    </div>
    <div class="bottle">
      <div class="shadow c"></div>
      <div class="box c">Aquamarine&emsp;&emsp;
        <div class="bobble"></div>
        <h2>3</h2>
      </div>
    </div>
    <div class="bottle">
      <div class="shadow d"></div>
      <div class="box d">Diamond&emsp;&emsp;
        <div class="bobble"></div>
        <h2>4</h2>
      </div>
    </div>
    <div class="bottle">
      <div class="shadow e"></div>
      <div class="box e">Emerald&emsp;&emsp;
        <div class="bobble"></div>
        <h2>5</h2>
      </div>
    </div>
    <div class="bottle">
      <div class="shadow f"></div>
      <div class="box f">Alexandrite&emsp;&emsp;
        <div class="bobble"></div>
        <h2>6</h2>
      </div>
    </div>
    <div class="bottle">
      <div class="shadow g"></div>
      <div class="box g">Ruby&emsp;&emsp;
        <div class="bobble"></div>
        <h2>7</h2>
      </div>
    </div>
    <div class="bottle">
      <div class="shadow h"></div>
      <div class="box h">Peridot&emsp;&emsp;
        <div class="bobble"></div>
        <h2>8</h2>
      </div>
    </div>
    <div class="bottle">
      <div class="shadow i"></div>
      <div class="box i">Sapphire&emsp;&emsp;
        <div class="bobble"></div>
        <h2>9</h2>
      </div>
    </div>
    <div class="bottle">
      <div class="shadow j"></div>
      <div class="box j">Tourmaline&emsp;&emsp;
        <div class="bobble"></div>
        <h2>10</h2>
      </div>
    </div>
    <div class="bottle">
      <div class="shadow k"></div>
      <div class="box k">Topaz&emsp;&emsp;
        <div class="bobble"></div>
        <h2>11</h2>
      </div>
    </div>
    <div class="bottle">
      <div class="shadow l"></div>
      <div class="box l">Turquoise&emsp;&emsp;
        <div class="bobble"></div>
        <h2>12</h2>
      </div>
    </div>
  </div>

相关推荐

发表评论

相关文章