GridView使用自带分页功能时分页方式及样式PagerStyle

// location.href="http://www.bubuko.com/infodetail-412562.html";
// ]]>

转向地址：http://www.bubuko.com/infodetail-412562.html

GridView分页，使用自带分页功能，类似下面样式：



在aspx页面中，GridView上的PagerStyle下CssClass属性，设置为bubufxPagerCss，具体aspx页面代码：

<asp:GridView ID="GridView1" runat="server" Width="100%" AutoGenerateColumns="False"
AllowPaging="True" EmptyDataText="没有数据记录！！" OnPageIndexChanging="GridView1_PageIndexChanging"
ShowHeader="False" GridLines="None">
<Columns>
<asp:BoundField DataField="ID" HeaderText="ID" />
<asp:BoundField DataField="name" HeaderText="name" />
<asp:BoundField DataField="card" HeaderText="card" />
<asp:TemplateField ItemStyle-HorizontalAlign="right" ItemStyle-CssClass="list" ItemStyle-Width="100">
<ItemTemplate>
<%# Eval("ctime", "{0:yyyy-MM-dd}")%>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<PagerSettings FirstPageText="首页" LastPageText="末页" NextPageText="下一页" PageButtonCount="5"
PreviousPageText="上一页" Mode="NumericFirstLast" />
<PagerStyle BorderColor="#66FF66" Font-Names="宋体" Font-Size="12px" HorizontalAlign="Center"
CssClass="bubufxPagerCss" />
</asp:GridView>

px.cs代码：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

using System.Data.OleDb;
using System.Data;

public partial class list : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
dataBind();
}

}

private void dataBind()
{
string sql = "select * from tt ";

try
{
DataTable DT = new DataTable();
//
string connStr = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("db.mdb");

OleDbConnection conn = new OleDbConnection(connStr);

if (conn.State == ConnectionState.Closed) conn.Open();
OleDbDataAdapter da = new OleDbDataAdapter(sql, conn);

da.Fill(DT);
conn.Close();
//

GridView1.DataSource = DT;
GridView1.DataBind();
}
catch (Exception ex)
{
Response.Write("数据库错误，错误原因：" + ex.Message);
Response.End();
}
}

protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
GridView1.PageIndex = e.NewPageIndex;
dataBind();

}

}

css代码：

.bubufxPagerCss table
{
text-align:center;
margin:auto;
}
.bubufxPagerCss table td
{
border:0px;
padding:5px;
}
.bubufxPagerCss td
{
border-left: #ffffff 3px solid;
border-right: #ffffff 3px solid;
border-bottom: #ffffff 3px solid;
}
.bubufxPagerCss a
{
color:#231815;text-decoration:none;padding:3px 6px 3px 6px; margin: 0 0 0 4px; text-align:center; border:1px solid #ac1f24;
}
.bubufxPagerCss span
{
color:#fefefe;background-color:#ac1f24; padding:3px 6px 3px 6px; margin: 0 0 0 4px; text-align:center; font-weight:bold; border:1px solid #ac1f24;
}

这样就实现自带分页的页码样式了。