CSS樣式的簡單使用
在做項目時，有時做用到一行分幾列顯示內容，用datalist綁定，可以實現。但有時因我們不是設計師，有的代碼不利於我們在itemtemplate中綁定內容.用ul +li 再加上CSS控制，就可以實現一行多列的情景，但這時不能在datalist的 itemtemplate中綁定 li,因為datalist產生的用戶端代碼是以table進行排版的，不是按html格式排版的，有人知道了，對了，用repeater控制項.repeater控制項是原樣輸出在itemtemplate的html標記的，如下：
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<li>
<img height="46" src="<%#Eval("imgUrl") %>" width="82">
</li>
</li>
</ItemTemplate>
</asp:Repeater>
後台綁定代碼略了，我想信大家都已經早會用了，不用再重複了。當然這樣產生出來的，還不能實現一行多列的效果，還得加CSS樣式表,如下（添加到<head></head>中）：
<style type="text/css">
ul
{
width:180px;
}
li{
width:90px;
float:left;
}
</style>
ul的寬度是控制一行顯示幾個li,如上例ul 的寬度為180px, li寬度為90px，同時要把li的float設定為left，這樣，一行就顯示兩行了。
最後，將用例代碼放上:
/Files/kevinlzf/css.rar
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
