repeater换行问题

Question

我想在首页的repeater中显示6张图片 格式为两行三列 请问我该如何实现换行呢？目前代码如下
<div class="regular_section">
                            <h3>
                                图片报道</h3>
                            <ul>
                                <asp:Repeater ID="Repeater1" runat="server">
                                    <ItemTemplate>
                                        <li><%#(DataBinder.Eval(Container.DataItem, "title2"))%>…</a></li>
                                    </ItemTemplate>
                                </asp:Repeater>
                            </ul>
                         </div> 

Answer 1

你的是li ，要用css控制
<style type="text/css">
<!--
ul{ list-style:none; padding:0px; margin:0px; width:590px;
height:20px; line-height:20px; border:1px solid #99CC00;
border-top:0px; font-size:12px;}
ul li{ display:block; width:33%; float:left;text-indent:2em}
.th{ background:#F1FADE; font-weight:bold; border-top:1px }
-->
</style>
本文转自【66CSS教程网】：(http://www.66css.com/)[原文地址]：http://www.66css.com/cssjiaocheng/182.html

Answer 2

用css定义ul和li，设置ul的width，设置li的width基本等于ul的一半、向左浮动。

Answer 3

设置li的width基本等于ul的一半、向左浮动。
＝》
改为
设置li的width基本等于ul的三分之一、向左浮动，高度等于ul的一般。

Answer 4

处理Repeater的ItemDataBound事件，通过代码来控制显示每行的个数。<div class="regular_section">
  <h3>图片报道</h3>
  <ul>
      <asp:Repeater ID="Repeater1" runat="server" OnItemDataBound="Repeater1_ItemDataBound">
           <ItemTemplate>
                <li><%#(DataBinder.Eval(Container.DataItem, "title2"))%>…</a></li>
          </ItemTemplate>
      </asp:Repeater>
  </ul>
</div> ...
private int i=0;
protected void rptStatus_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
       if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
       {
            if (i % 3 == 0 && i > 0)
            {
                e.Item.Controls.Add(new LiteralControl("</ul><ul>"));
            }
            i++;
       }
}
...

Answer 5

纠正一下<div class="regular_section">
  <h3>图片报道</h3>
  <ul>
      <asp:Repeater ID="Repeater1" runat="server" OnItemDataBound="Repeater1_ItemDataBound">
           <ItemTemplate>
                <li><%#(DataBinder.Eval(Container.DataItem, "title2"))%>…</a></li>
          </ItemTemplate>
      </asp:Repeater>
  </ul>
</div> ...
private int i=0;
protected void Repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
       if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
       {
            if (i % 3 == 0 && i > 0)
            {
                e.Item.Controls.Add(new LiteralControl("</ul><ul>"));
            }
            i++;
       }
}
...

Answer 6

若是ul，li不行的话，用table tr 代替,这样肯定没有问题的。给你一个我以前写的链接
http://blog.csdn.net/taomanman/article/details/5910199<div class="regular_section">
  <h3>图片报道</h3>
      <asp:Repeater ID="Repeater1" runat="server" OnItemDataBound="Repeater1_ItemDataBound">
         <HeaderTemplate>
              <table>
                  <tr>
        </HeaderTemplate>
         <ItemTemplate>
                <td><%#(DataBinder.Eval(Container.DataItem, "title2"))%>…</a></td>
          </ItemTemplate>
         <FooterTemplate>
                  </tr>
             </table>
       </FooterTemplate>
      </asp:Repeater>
</div> ...
private int i=0;
protected void Repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
       if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
       {
            if (i % 3 == 0 && i > 0)
            {
                e.Item.Controls.Add(new LiteralControl("</tr><tr>"));
            }
            i++;
       }
}
...

Answer 7

也可以用DataList来布局，
布局方法、数据绑定与repeater类似，设置属性
RepeatDirection(布局方向)="Horizontal"(横向) 
RepeatColumns（每列数目）="3"，