css - 如何将列表 ul 设置为正方形

Question

我有这个 ul

 <ul>
<li>image</li>
<li>image</li>
<li>image</li>
</ul>

有谁知道如何将这个 ul 转换为这样的 suare？ http://i.stack.imgur.com/7MQJi.jpg

Answer 1

这个怎么样

ul{
    width:300px;
    list-style:none;
}
ul li:nth-child(1){
    height:210px;
}
ul li{
    float:left;
    display:inline-block;
    width:100px;
    background:orange;
    height:100px;
    margin:5px;
}

<ul>
<li>image</li>
<li>image</li>
<li>image</li>
</ul>