ListView中使用ul-li布局展示数据

前台代码：

<!--comment books start-->
        <div id="comment_book">
            <!-- 使用ListView展示数据 -->
            <asp:ListView ID="lvBookList" runat="server" 
            onpagepropertieschanging="lvBookList_PagePropertiesChanging">
               
                <LayoutTemplate>
                    <!-- 占位符控件，此处使用ul -->
                    <ul id="itemPlaceholder" runat="server"></ul>
                </LayoutTemplate>
                <!-- 显示信息，此处使用li -->
                <ItemTemplate>
                    <li>
                        <a href="#"><img src='Images/BookCovers/<%#Eval("ISBN") %>.jpg' 
                        alt='<%#Eval("Title") %>' width="100px" height="120px" /></a>
                        <a href="#"><%#CutString2(Eval("Title"),15)%></a><br />
                        <%#Eval("UnitPrice","{0:C2}")%></a>
                    </li>
                </ItemTemplate>
            </asp:ListView>
            <!-- 分页控件 -->
            <asp:DataPager ID="dpNewBook" runat="server" PagedControlID="lvBookList" PageSize="12">
                 <Fields>
                     <asp:NumericPagerField ButtonCount="10" NextPageText="下一页" 
                     PreviousPageText="上一页" />
                 </Fields>
            </asp:DataPager>
        </div>
        <!--comment books end-->

CSS代码：

#comment_book{ height:100%; overflow:hidden;}
#comment_book li{ float:left; margin:0 5px 12px; text-align:center; display:inline;}
#comment_book li img{ display:block; border:1px solid #D4D7D6; padding:2px; margin-bottom:4px;}

后台代码：

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            bindListView();//将List中的数据绑定到ListView中
        }
    }
    /// <summary>
    /// 将List中的数据绑定到ListView中
    /// </summary>
    private void bindListView()
    {
        this.lvBookList.DataSource = BooksManager.GetBooks();
        this.lvBookList.DataBind();
    }
    /// <summary>
    /// 单击页码时触发
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    protected void lvBookList_PagePropertiesChanging(object sender, PagePropertiesChangingEventArgs e)
    {
        //点击分页控件中的页码时，进入新的页面
        this.dpNewBook.SetPageProperties(e.StartRowIndex, e.MaximumRows, false);
        //将List中的数据绑定到ListView中
        bindListView();
    }
    #region 截断图书显示内容
    /// <summary>
    /// 截断图书显示内容
    /// </summary>
    public static string CutString2(object content, int length)
    {
        string temp = content.ToString().Replace("<br/>", "").Replace("<br>", "");//先替换换行标签，保证不出现换行
        /*参数说明：要处理的字符串，符合条件的表达式[汉字]，替换的字符[内容随意写但是要两个字符，
         *因为一个中文对应两个字符，不区分大小写]
         */
        if (Regex.Replace(temp, "[\u4e00-\u9fa5]", "zz", RegexOptions.IgnoreCase).Length <= length)
        {
            return temp;
        }
        for (int i = temp.Length; i >= 0; i--)
        {
            temp = temp.Substring(0, i);
            if (Regex.Replace(temp, "[\u4e00-\u9fa5]", "zz", RegexOptions.IgnoreCase).Length <= length - 3)
            {
                return temp + "...";
            }
        }
        return "";
    }
    #endregion