float：center？？？

       老規矩，先上圖（請忽略圖中文字^V^）：

       乍一看感覺是對中間的圖片使用了float:center;但是仔細一想float屬性是沒有center這個值的。那是怎麼實現的呢？我一步一步拆給大家看。

1.構建主體結構

       container中放置兩個子元素，分別float:left和float:right;

2.使用僞元素:before爲中間的img佔位

       如果page-left和page-right之間沒有間隔，那兩個僞元素的寬就是中間img的一半，和img一樣高。

.page_left:before, .page_right:before {
            width: 151px;
            height: 278px;
            content: "";
        }
        .page_left:before{
            float: right;
        }
        .page_right:before{
            float: left;   
        }

 3.請img歸位

       僞元素已經爲img佔好位置，現在只需讓img歸位即可。

 .img {
            width: 302px;
            height: 278px;
            position: absolute;
            top:0;
            left: 349px;
            background-image: url("img/sec1_qq.png");
        }

       demo請戳這裏：http://runjs.cn/detail/nqhgwmbm，也可附件下載。本人菜鳥，輕拍！！！