-
< asp:datalist id ="MyList" runat ="server" > < ItemTemplate > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=<%# DataBinder.Eval(Container.DataItem, " id")% > " target="frmleft"> < font > <% # DataBinder.Eval(Container.DataItem, " name " ) %> </ font ></ a ></ li > </ ItemTemplate > </ asp:datalist > 编译后代码如下: < div id ="daohang" > < table id ="menuhead1_MyList" cellspacing ="0" border ="0" style ="border-collapse:collapse;" > < tr > < td > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=1" target ="frmleft" >< font > 手机 </ font ></ a ></ li > </ td > </ tr >< tr > < td > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=2" target ="frmleft" >< font > 笔记本 </ font ></ a ></ li > </ td > </ tr >< tr > < td > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=3" target ="frmleft" >< font > 电脑配件 </ font ></ a ></ li > </ td > </ tr >< tr > < td > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=4" target ="frmleft" >< font > 服装 </ font ></ a ></ li > </ td > </ tr >< tr > < td > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=5" target ="frmleft" >< font > 玩具 </ font ></ a ></ li > </ td > </ tr >< tr > < td > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=6" target ="frmleft" >< font > 其它 </ font ></ a ></ li > </ td > </ tr > </ table > </ div >
-
HTML code
-
< asp:Repeater id ="MyList" runat ="server" > < ItemTemplate > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=<%# DataBinder.Eval(Container.DataItem, " id")% > " target="frmleft"> < font > <% # DataBinder.Eval(Container.DataItem, " name " ) %> </ font ></ a ></ li > </ ItemTemplate > </ asp:Repeater > 生成代码如下 < div id ="daohang" > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=1" target ="frmleft" >< font > 手机 </ font ></ a ></ li > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=2" target ="frmleft" >< font > 笔记本 </ font ></ a ></ li > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=3" target ="frmleft" >< font > 电脑配件 </ font ></ a ></ li > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=4" target ="frmleft" >< font > 服装 </ font ></ a ></ li > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=5" target ="frmleft" >< font > 玩具 </ font ></ a ></ li > < li style =" list-style-type:none;float:left;width:10%; margin:2px auto; " > < a href ="menuleft.aspx?id=6" target ="frmleft" >< font > 其它 </ font ></ a ></ li > </ div > datalist 硬生生的套了一个table上去.多了很多标签. repeater就简洁很多了.忠实于原格式. 如果只是简单显示数据加上自己的css比较厉害,那就用repeater 如果想每行显示多少列 打横显示还是打竖显示就用datalist简单配置一下 RepeatDirection="Horizontal" RepeatColumns="2"