SOURCE

<div class="container_12">
        <div class="grid_12">940</div>
        <div class="grid_1">60</div>
        <div class="grid_11">860</div>
        <div class="grid_2">140</div>
        <div class="grid_10">780</div>
        <div class="grid_3">220</div>
        <div class="grid_9">700</div>
        <div class="grid_4">300</div>
        <div class="grid_8">620</div>
        <div class="grid_5">380</div>
        <div class="grid_7">700</div>
        <div class="grid_6">460</div>
        <div class="grid_6">460</div>
        <div class="grid_3">220</div>
         <div class="grid_3">220</div>
         <div class="grid_3">220</div>
         <div class="grid_3">220</div>
         
    </div>

/* 定义容器 */
        .container_12{
            margin-left: auto;
            margin-right: auto;
            width: 960px;
        }
    /* 栅格的全局变量 */
        .grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,
        .grid_9,.grid_10,.grid_11,.grid_12{
            display: inline;
            float: left;
            margin-left: 10px;
            margin-right: 10px;
            text-align: center;
            background-color: pink;
            margin-top: 15px;
        }
    /* 分别设置栅格宽度 */
        .container_12 .grid_1{
            width: 60px;
        }
        .container_12 .grid_2{
            width: 140px;
        }
        .container_12 .grid_3{
            width: 220px;
        }
        .container_12 .grid_4{
            width: 300px;
        }
        .container_12 .grid_5{
            width: 380px;
        }
        .container_12 .grid_6{
            width: 460px;
        }
        .container_12 .grid_7{
            width: 540px;
        }
        .container_12 .grid_8{
            width: 620px;
        }
        .container_12 .grid_9{
            width: 700px;
        }
        .container_12 .grid_10{
            width: 780px;
        }
        .container_12 .grid_11{
            width: 860px;
        }
        .container_12 .grid_12{
            width: 940px;
        }