页面的head部分，仅需引入以个CSS样式文件，代码如下：

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

页面的body部分，每个loading动画都放在一个div容器里面，四个动画为一组，代码如下：

<div class="wrapper">
    <h1>12种纯CSS加载动画组件</h1>
    <div class="row cf">
        <div class="span">
            <div class="timer"></div>
        </div>
        <div class="span">
            <div class="typing_loader"></div>
        </div>
        <div class="span">
            <div class="location_indicator"></div>
        </div>
        <div class="span">
            <div class="dashboard"></div>
        </div>
    </div>
    <div class="row cf">
        <div class="span">
            <div class="battery"></div>
        </div>
        <div class="span">
            <div class="magnifier"></div>
        </div>
        <div class="span">
            <div class="help"></div>
        </div>
        <div class="span">
            <div class="cloud"></div>
        </div>
    </div>
    <div class="row cf">
        <div class="span">
            <div class="eye"></div>
        </div>
        <div class="span">
            <div class="coffee_cup"></div>
        </div>
        <div class="span">
            <div class="square"></div>
        </div>
        <div class="span">
            <div class="circle"></div>
        </div>
    </div>
</div>