CSS样式的简单使用
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
