弹性布局

.test {
    font-size: 40px;
    color: yellow;
}
.box {
    padding: 0 30px;
}

.ul0 {
    box-sizing: border-box;
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
}

.li0 {
    /* width: 150px; */
    flex: 1;
    /* height: 200px; */
    /* background-color: silver; */
    border:1px dashed silver; s
margin: 6px;
}

.ul1 {
    box-sizing: border-box;
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
}

.li1 {
    box-sizing: border-box;
    flex: 1;
    height: 100px;

    background-color: green;
    margin: 4px 4px;

}

        <div class="box">
            <ul class="ul0">
                <li class="li0">
                    <ul class="ul1">
                        <li class="li1"></li>
                        <li class="li1"></li>
                    </ul>
                    <ul class="ul1">
                        <li class="li1"></li>
                        <li class="li1"></li>
                    </ul>
                </li>
                <li class="li0">
                    <ul class="ul1">
                        <li class="li1"></li>
                        <li class="li1"></li>
                    </ul>
                    <ul class="ul1">
                        <li class="li1"></li>
                        <li class="li1"></li>
                    </ul>
                </li>
                <li class="li0">
                    <ul class="ul1">
                        <li class="li1"></li>
                        <li class="li1"></li>
                    </ul>
                    <ul class="ul1">
                        <li class="li1"></li>
                        <li class="li1"></li>
                    </ul>
                </li>
                <!-- <li></li> -->
            </ul>

        </div>

 

npm install angular@1.5.0
npm install angular-route@1.5.0
npm install angular-ui-bootstrap@2.5.6
npm install bootstrap@3.3.7