ul li 下div 分块显示,类似于dudool的楼层显示展现category

.category-entry-box {
    width: 751px;
    border-top-style: solid;
    border-top-width: 2px;
    float: left;
    position: relative;
    border-top-color: #2E82D0;
    border-top: none;
    height: auto !important;
}

.category-entry-box ul li div {
    position: absolute;
}

.category-entry-box li {
    width:751px;
    background: white;
    display: list-item;
}

位置要absolute,否则会按照一列显示。

<div class="category-entry-box">
                <ul>
                    <li>
                        <div style="left: 0; top: 0; width: 354px; height: 320px;">
                            <a href="/furnitures/beds" target="_blank"><img
                                src="banner/c/furright1.jpg" alt="furniture Banner"></a>
                        </div>
                        <div style="left: 354px; top: 0; width: 397px; height: 161px;">
                            <a href="/furnitures/sofas" target="_blank"><img
                                src="banner/c/furright2.jpg" alt="furniture Banner"></a>
                        </div>
                        <div style="left: 354px; top: 161px; width: 205px; height: 159px;">
                            <a href="/furnitures/chairs" target="_blank"><img
                                src="banner/c/furright3.jpg" alt="furniture Banner"></a>
                        </div>
                        <div style="left: 559px; top: 161px; width: 192px; height: 159px;">
                            <a href="/furnitures/tables" target="_blank"><img
                                src="banner/c/furright4.jpg" alt="furniture Banner"></a>
                        </div>
                    </li>
                </ul>
            </div>

 

posted @ 2013-02-06 17:17  awinlei  阅读(977)  评论(0编辑  收藏  举报